diff --git a/landing/keyservers.react.js b/landing/keyservers.react.js
index 157aa8c43..cf4409094 100644
--- a/landing/keyservers.react.js
+++ b/landing/keyservers.react.js
@@ -1,147 +1,147 @@
 // @flow
 
 import { create } from '@lottiefiles/lottie-interactivity';
 import * as React from 'react';
 
 import { useIsomorphicLayoutEffect } from 'lib/hooks/isomorphic-layout-effect.react.js';
 
 import { assetsCacheURLPrefix } from './asset-meta-data.js';
 import css from './keyservers.css';
 import ReadDocsButton from './read-docs-btn.react.js';
 import StarBackground from './star-background.react.js';
 
 function Keyservers(): React.Node {
   React.useEffect(() => {
     import('@lottiefiles/lottie-player');
   }, []);
 
   const onEyeIllustrationLoad = React.useCallback(() => {
     create({
       mode: 'scroll',
       player: '#eye-illustration',
       actions: [
         {
           visibility: [0, 1],
           type: 'seek',
           frames: [0, 720],
         },
       ],
     });
   }, []);
 
   const onCloudIllustrationLoad = React.useCallback(() => {
     create({
       mode: 'scroll',
       player: '#cloud-illustration',
       actions: [
         {
           visibility: [0, 0.2],
           type: 'stop',
           frames: [0],
         },
         {
           visibility: [0.2, 1],
           type: 'seek',
           frames: [0, 300],
         },
       ],
     });
   }, []);
 
   const [eyeNode, setEyeNode] = React.useState(null);
   useIsomorphicLayoutEffect(() => {
     if (!eyeNode) {
       return undefined;
     }
     eyeNode.addEventListener('load', onEyeIllustrationLoad);
     return () => eyeNode.removeEventListener('load', onEyeIllustrationLoad);
   }, [eyeNode, onEyeIllustrationLoad]);
 
   const [cloudNode, setCloudNode] = React.useState(null);
   useIsomorphicLayoutEffect(() => {
     if (!cloudNode) {
       return undefined;
     }
     cloudNode.addEventListener('load', onCloudIllustrationLoad);
     return () => cloudNode.removeEventListener('load', onCloudIllustrationLoad);
   }, [cloudNode, onCloudIllustrationLoad]);
 
   return (
     <div>
       <StarBackground />
       <div className={css.body_grid}>
         <div className={`${css.hero_image} ${css.starting_section}`}>
           <lottie-player
             id="eye-illustration"
             ref={setEyeNode}
             mode="normal"
             src={`${assetsCacheURLPrefix}/animated_eye.json`}
             speed={1}
           />
         </div>
         <div className={`${css.hero_copy} ${css.section}`}>
           <h1 className={css.mono}>
             Reclaim your
             <span className={css.purple_accent}> digital&nbsp;identity.</span>
           </h1>
           <p>
             The Internet is broken today. Private user data is owned by
             mega-corporations and farmed for their benefit.
           </p>
           <p>
             E2E encryption has the potential to change this equation. But
-            it&apos;s constrained by a crucial limitation.
+            it&rsquo;s constrained by a crucial limitation.
           </p>
         </div>
 
         <div className={`${css.server_image} ${css.starting_section}`}>
           <lottie-player
             id="cloud-illustration"
             ref={setCloudNode}
             mode="normal"
             src={`${assetsCacheURLPrefix}/animated_cloud.json`}
             speed={1}
           />
         </div>
         <div className={`${css.server_copy} ${css.section}`}>
           <h1 className={css.mono}>Apps need servers.</h1>
           <p>
             Sophisticated applications rely on servers to do things that your
-            devices simply can&apos;t.
+            devices simply can&rsquo;t.
           </p>
           <p>
-            That&apos;s why E2E encryption only works for simple chat apps
-            today. There&apos;s no way to build a robust server layer that has
+            That&rsquo;s why E2E encryption only works for simple chat apps
+            today. There&rsquo;s no way to build a robust server layer that has
             access to your data without leaking that data to corporations.
           </p>
         </div>
 
         <div className={css.keyserver_company}>
           <h1>
             Comm
             <span className={css.mono}>
               {' '}
               is the <span className={css.purple_accent}>keyserver</span>{' '}
               company.
             </span>
           </h1>
         </div>
 
         <div className={css.keyserver_copy}>
           <p>In the future, people have their own servers.</p>
           <p>
             Your keyserver is the home of your digital identity. It owns your
-            private keys and your personal data. It&apos;s your password
+            private keys and your personal data. It&rsquo;s your password
             manager, your crypto bank, your digital surrogate, and your second
             brain.
           </p>
         </div>
         <div className={css.read_the_docs}>
           <ReadDocsButton />
         </div>
       </div>
     </div>
   );
 }
 
 export default Keyservers;
diff --git a/landing/privacy.react.js b/landing/privacy.react.js
index 75f9c27f9..3fdb4ef6a 100644
--- a/landing/privacy.react.js
+++ b/landing/privacy.react.js
@@ -1,428 +1,428 @@
 // @flow
 
 import * as React from 'react';
 
 import css from './legal.css';
 
 function Privacy(): React.Node {
   return (
     <div className={css.legal_container}>
       <h1>Privacy Policy</h1>
 
       <p>
         Effective date: <strong>February 2, 2023</strong>
       </p>
 
       <h2>Introduction</h2>
 
       <p>
         We built Comm as a privacy-focused alternative to the cloud-based
         community chat apps that exist today. In order to protect the privacy of
         user content, communities on Comm are hosted on private keyservers, and
         messages transmitted through the platform are encrypted, preventing us
         from being able to access their contents. While Comm does collect a
         minimal amount of information as necessary to power and maintain the
         Services, Comm will never be able to access or view the substance of
         your Content. This Privacy Policy describes the limited ways in which
         Comm uses information in connection with its Services.
       </p>
 
       <p>
         <strong>
           ‌By using or accessing our Services, you acknowledge that you accept
           the practices and policies outlined below.
         </strong>
       </p>
 
       <h2>Table of Contents</h2>
 
       <ul>
         <li>
           <strong>Information We Collect</strong>
         </li>
         <li>
           <strong>Public Blockchain Information</strong>
         </li>
         <li>
           <strong>How We May Share Your Information</strong>
         </li>
         <li>
           <strong>Retention of Information</strong>
         </li>
         <li>
           <strong>Your Rights in the Personal Data You Provide to Us</strong>
         </li>
         <li>
           <strong>Deleting Your Data</strong>
         </li>
         <li>
           <strong>Changes to this Privacy Policy</strong>
         </li>
         <li>
           <strong>Terms of Use</strong>
         </li>
         <li>
           <strong>Contact Information</strong>
         </li>
       </ul>
 
       <h2>Information We Collect</h2>
 
       <p>
         We collect the following categories of information, some of which might
         constitute personal information:
       </p>
 
       <ol>
         <li>
           <strong>Account Information.</strong> In order to use Comm, you will
           be required to create an account, and in doing so, may be required to
           provide a username and password to us. We only store salted and hashed
           versions of your password – we never store the plaintext version. No
           other information is required to create an account and we do not want
           you to provide any other information.
         </li>
         <li>
           <strong>Blockchain Account Information.</strong> You may instead
           choose to log into Comm using a third-party blockchain provider (such
           as, Sign-In with Ethereum or similar functionality), in which case you
           will be required to provide your blockchain address to us. The only
           information we collect as part of this process is information that is
           already publicly available.
         </li>
         <li>
           <strong>Backup Service.</strong> You have the option to back up your
           Content on Comm’s hosted servers, allowing you to recover any
           backed-up Content. If you do not opt out of the backup service, your
           Content will be stored in our automated backup service.{' '}
           <strong>
             Your Content will always remain end-to-end encrypted, even when
             stored through our backup service.
           </strong>{' '}
           You may recover your backed-up Content through an automatic recovery
           process available through your account. If you request your Content,
           Comm will verify your identity cryptographically to verify that the
           Content you are requesting belongs to you; however, such request will
           not allow Comm to collect or view any information that is not already
           outlined in this Privacy Policy and your backed-up Content will only
           be associated with your account. The backup service only allows Comm
           to collect encrypted versions of your Content – at no point will Comm
           have the ability to access or view the substance of your Content nor
           will Comm ever have the ability to decrypt your Content collected
           through the backup service. You may opt-out of this backup service at
           any time by doing so within the app.
         </li>
         <li>
           <strong>Updates About the Services.</strong> If you choose to receive
           updates on Comm’s progress, you will be required to provide your email
           address to us. If you choose to send any emails to us in response to
           such updates or otherwise, we may collect the content of such emails.
           These email addresses, and any emails received from you, will not be
           associated with any accounts, and will not be used for any purpose
           other than to provide updates on Comm and to otherwise respond to you.
         </li>
         <li>
           <strong>Time Zone Detection.</strong> When responding to a web
           request, we use the requester’s IP address in order to determine which
           time zone to render timestamps in. We do not store these IP addresses
           or associate them with specific accounts.
         </li>
         <li>
           <strong>Security, Fraud and Abuse.</strong> In order to detect and
           prevent abuse of our Services and cyberattacks, we keep track of
           request metadata, which includes requests made by IP addresses as well
           as the frequency of those requests. This data is only stored on a
           short-term basis and is never associated with specific accounts, even
           if the requests themselves originate from or are associated with
           specific accounts. Additionally, we may view and block certain IP
           address ranges as necessary to comply with applicable United States
           export control laws and regulations.
         </li>
         <li>
           <strong>Optimizing the Services.</strong> In order to optimize the
           Services provided to you, we keep track of which version of Comm’s
           code you are running as well as the platform that you are using to run
           Comm’s code (e.g., iOS, Android, web server, keyserver). We only
           collect this information to provide the Services to you, and are not
           able to access or view the substance of your Content in connection
           with such collection.
         </li>
         <li>
           <strong>Crash Reports.</strong> If you choose to send us a crash
           report, we may collect data from such reports for purposes of
           debugging and system maintenance. These reports contain operational
           information such as telemetry data (e.g., information with respect to
           the recent connection between the client and server), metadata (e.g.,
           time stamps from messages sent in a conversation or chat), and device
           data (e.g., your device’s operating system) but never contain the
           content of your messages.
         </li>
         <li>
           <strong>Push Notifications.</strong> If you choose to allow push
           notifications to your device, your device’s operating system’s
           provider will know that you are using the Services and may be able to
           see the Content you transmit using the Services. We only collect push
           tokens required to send you such notifications and these tokens do not
           permit us to access or view your Content.
         </li>
         <li>
           <strong>Contact List.</strong> If you allow us to do so, we can
           discover which contacts in your address book are Comm users by using
           technology designed to protect the privacy of you and your contacts.
           If you opt to discover other Comm users in your contact list, phone
           numbers from the contacts on your device, as well as your own phone
           number, will be hashed and transmitted to Comm in order to match you
           and your friends on the Services. Since this contact information is
           hashed, Comm cannot view or access the plaintext version.
         </li>
         <li>
           <strong>Cookies.</strong> We only use a single cookie per user in
           order to authenticate a user as being logged in to Comm. Most browsers
           allow you to decide whether to accept these cookies and whether to
           remove any cookies already on your device. If you disable these
           cookies, you will not be able to stay logged into Comm.
         </li>
         <li>
           <strong>Bots.</strong> We may communicate with you through the
           Services by using bots, and we will have access to any information you
           voluntarily provide in response to those bots. We only collect this
           information to provide the Services to you, and are not able to access
           or view the substance of any other Content in connection with such
           collection.
         </li>
         <li>
           <strong>Content.</strong> Other Comm users may have access to, and
           have the ability to store, all or some of the Content owned by you.{' '}
           <strong>
             However, as this Content is end-to-end encrypted, we have no ability
             to access or view the substance of your Content.
           </strong>{' '}
           For more information on how Comm works, please{' '}
           <a href="https://www.notion.so/How-Comm-works-d6217941db7c4237b9d08b427aef3234">
             click here
           </a>
           .
         </li>
         <li>
           <strong>Anonymized Data.</strong> We may create aggregated,
           de-identified or anonymized data from the information we collect from
           you, including by removing information that makes the data personally
           identifiable to you. We may use such aggregated, de-identified or
           anonymized data for our own lawful business purposes, including to
           analyze, build and improve the Services and promote our business,
           provided that we will not use such data in a manner that could
           identify you.
         </li>
       </ol>
 
       <h2>Public Blockchain Information</h2>
 
       <p>
         Information posted on a blockchain is publicly available and auditable.
         When you and other users use the Services, Comm’s applications will
         automatically make calls to third-party blockchain providers using
         users’ blockchain addresses (including yours) to access publicly
         available information about those blockchain addresses (e.g., ENS name,
         ENS avatar). Such publicly available information will then be displayed
         through the Services to you and/or other Comm users. This information is
         not shared or stored by Comm, and the only information accessible and
         displayed is information that is publicly available on the blockchain.
       </p>
 
       <p>
         Additionally, if you choose to use Comm’s applications, third-party
         blockchain providers may also have access to your IP address. While your
         IP address is not shared by Comm, it is automatically accessible by such
         providers through your use of Comm’s applications, regardless of whether
         you intend to make such information available. This access is required
         in order to allow Comm users to make calls to third-party blockchain
         providers, and Comm has no control over what such third-party blockchain
         provider may do with your IP address.
       </p>
 
       <h2>How We May Share Your Information</h2>
 
       <p>
         We may share the information we collect with third parties for the
         reasons listed below.{' '}
         <strong>
           However, your Content will always remain end-to-end encrypted, even
           when stored in the backup service, and Comm has no ability to decrypt
           that information for any third party.{' '}
         </strong>
         Moreover, we will <strong>never</strong> sell, rent or monetize your
         information.
       </p>
 
       <ol>
         <li>
           To fulfill our legal obligations under applicable law, regulation,
           court order or other legal process.
         </li>
         <li>
           To protect the rights, property or safety of you, Comm Technologies or
           another party as required or permitted by law.
         </li>
         <li>To enforce any agreements with you.</li>
         <li>
           Pursuant to a merger, acquisition, bankruptcy or other transaction in
           which that third party assumes control of our business (in whole or in
           part).
         </li>
       </ol>
 
       <p>
         While sharing your email address is entirely optional, if you do choose
         to share it, we may share that email address, and the contents of any
         email sent by us or you, with our third-party service providers who may
         assist us in providing updates to you. Such information would be shared
         with such third-party service providers for the sole purpose of
         providing you updates on Comm, and will never be associated with your
         account or sold, rented or otherwise monetized.
       </p>
 
       <p>
         Additionally, Comm uses third-party hosting providers to host its
         central cloud servers, therefore we may share the information we collect
         with such hosting providers in order for them to host this information.
         This information will be shared with such hosting providers for the sole
         purpose of providing the Services to you, and your Content will always
         remain end-to-end encrypted when shared with such hosting providers,
         even when stored in the backup service.
       </p>
 
       <h2>Retention of Information</h2>
 
       <p>
         For any of your personal information that we collect, we retain such
         personal information for as long as you have an open account with us or,
         only with respect to the association between your account and public
         key, as otherwise necessary to provide our Services.
       </p>
 
       <h1>Your Rights in the Personal Data You Provide to Us</h1>
 
       <h2>Your Rights</h2>
 
       <p>
         Under applicable data protection legislation, in certain circumstances,
         you have rights concerning your personal data. You have a right to:
       </p>
 
       <ol>
         <li>
           <strong>Access.</strong> You can request more information about the
           personal data we hold about you and request a copy of such personal
           data.
         </li>
         <li>
           <strong>‌Rectification.</strong> You can correct any inaccurate or
           incomplete personal data we are holding about you.
         </li>
         <li>
           <strong>Erasure.</strong> You can request that we erase some or all of
           your personal data from our systems.
         </li>
         <li>
           <strong>Withdrawal of Consent.</strong> You have the right to withdraw
           your consent to our processing of your personal data at any time.
           Please note, however, that if you exercise this right, you may have to
           then provide express consent on a case-by-case basis for the use or
           disclosure of certain of your personal data, if such use or disclosure
           is necessary to enable you to utilize some or all of our Services.
         </li>
         <li>
           <strong>Portability.</strong> You can ask for a copy of your personal
           data in a machine-readable format and can also request that we
           transmit the data to another data controller where technically
           feasible.
         </li>
         <li>
           <strong>Objection.</strong> You can contact us to let us know that you
           object to the further use of your personal data.
         </li>
         <li>
           <strong>Restriction of Processing.</strong> You can ask us to restrict
           further processing of your personal data.
         </li>
         <li>
           <strong>Right to File Complaint.</strong> You have the right to lodge
           a complaint with national data protection authorities regarding our
           processing of your personal data.
         </li>
       </ol>
 
       <h2>Exercising Your Rights</h2>
 
       <p>
         If you wish to exercise any of these rights, please contact us using the
         details below.
       </p>
 
       <h2>Deleting Your Data</h2>
 
       <p>
         If you would like to delete your account, you can do this either by
         deleting your account within the app, or by contacting us using the
         information below. Deleting your account removes all personal
         information that you provided to us.
       </p>
 
       <p>
         Termination of your account may or may not result in destruction of
         Content associated with your account, and other Comm users may continue
         to have access to and control over your Content.
       </p>
 
       <p>
         If you would like to delete any backed-up Content from our backup
         service, you may do so at any time by making a request within the app.
       </p>
 
       <h2>Changes to this Privacy Policy</h2>
 
       <p>
         We may update this Privacy Policy from time to time. If you use the
         Services after any changes to the Privacy Policy have been posted, that
         means you agree to all of the changes. Use of information we collect is
         subject to the Privacy Policy in effect at the time such information is
         collected.
       </p>
 
       <h2>Terms of Use</h2>
 
       <p>
-        Remember that your use of Comm Technologies&apos; Services is at all
+        Remember that your use of Comm Technologies&rsquo; Services is at all
         times subject to our <a href="https://comm.app/terms">Terms of Use</a>,
         which incorporates this Privacy Policy. Any terms we use in this Policy
         without defining them have the definitions given to them in the Terms of
         Use.
       </p>
 
       <h2>Contact Information</h2>
 
       <p>
         If you have any questions or comments about this Privacy Policy, the
         ways in which we collect and use your information or your choices and
         rights regarding such collection and use, please do not hesitate to
         contact us at:
       </p>
 
       <ul>
         <li>
           Website: <a href="https://comm.app">https://comm.app</a>
         </li>
         <li>
           Email: <a href="mailto:support@comm.app">support@comm.app</a>
         </li>
         <li>Phone: +1 (332) 203-4023</li>
         <li>
           Address: Comm Technologies, Inc. / 203 Rivington St. Apt 1K / New
           York, NY 10002
         </li>
       </ul>
     </div>
   );
 }
 
 export default Privacy;
diff --git a/landing/qr.react.js b/landing/qr.react.js
index 3e7fdbcf0..8b0c1585d 100644
--- a/landing/qr.react.js
+++ b/landing/qr.react.js
@@ -1,68 +1,68 @@
 // @flow
 
 import {
   faTwitter,
   faGithub,
   faAppStoreIos,
 } from '@fortawesome/free-brands-svg-icons';
 import { faBook, faHome, faBriefcase } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import * as React from 'react';
 
 import stores from 'lib/facts/stores.js';
 
 import css from './qr.css';
 
 function QR(): React.Node {
   const iconStyle = React.useMemo(() => ({ marginRight: '20px' }), []);
 
   return (
     <div className={css.body}>
       <h1>Comm</h1>
 
       <a href="https://twitter.com/commdotapp">
         <div className={`${css.qr_link} ${css.qr_link_twitter}`}>
           <FontAwesomeIcon icon={faTwitter} size="lg" style={iconStyle} />
           <h3>@CommDotApp</h3>
         </div>
       </a>
 
       <a href="https://github.com/CommE2E/comm">
         <div className={`${css.qr_link} ${css.qr_link_github}`}>
           <FontAwesomeIcon icon={faGithub} size="lg" style={iconStyle} />
           <h3>CommE2E/comm</h3>
         </div>
       </a>
 
       <a href={stores.appStoreUrl}>
         <div className={`${css.qr_link} ${css.qr_link_appstore}`}>
           <FontAwesomeIcon icon={faAppStoreIos} size="lg" style={iconStyle} />
           <h3>App Store (pre-alpha)</h3>
         </div>
       </a>
 
       <a href="https://comm.app">
         <div className={`${css.qr_link} ${css.qr_link_comm}`}>
           <FontAwesomeIcon icon={faHome} size="lg" style={iconStyle} />
           <h3>Homepage</h3>
         </div>
       </a>
 
       <a href="https://www.notion.so/Comm-4ec7bbc1398442ce9add1d7953a6c584">
         <div className={`${css.qr_link} ${css.qr_link_comm}`}>
           <FontAwesomeIcon icon={faBook} size="lg" style={iconStyle} />
           <h3>Technical docs</h3>
         </div>
       </a>
 
       <a href="https://commapp.notion.site/commapp/Comm-is-hiring-db097b0d63eb4695b32f8988c8e640fd">
         <div className={`${css.qr_link} ${css.qr_link_comm}`}>
           <FontAwesomeIcon icon={faBriefcase} size="lg" style={iconStyle} />
-          <h3>We&apos;re hiring!</h3>
+          <h3>We&rsquo;re hiring!</h3>
         </div>
       </a>
     </div>
   );
 }
 
 export default QR;
diff --git a/landing/terms.react.js b/landing/terms.react.js
index 49d015e18..7c442c0dd 100644
--- a/landing/terms.react.js
+++ b/landing/terms.react.js
@@ -1,281 +1,281 @@
 // @flow
 
 import * as React from 'react';
 
 import css from './legal.css';
 
 function Terms(): React.Node {
   return (
     <div className={css.legal_container}>
       <h1>Terms of Use</h1>
       <p>
         Effective date: <strong>June 29, 2021</strong>
       </p>
 
       <p>
         These Terms of Use (the “Terms”) are a binding contract between you and{' '}
         <strong>COMM TECHNOLOGIES, INC.</strong> (“Comm Technologies,” “we” and
         “us”) and govern your use of our website, products, services and
         applications (the “Services”). Your use of the Services in any way means
         that you agree to all of these Terms, and these Terms will remain in
         effect while you use the Services. These Terms include the provisions in
         this document as well as those in the{' '}
         <a href="https://comm.app/privacy">Privacy Policy</a>.
       </p>
 
       <h2>Will these Terms ever change?</h2>
 
       <p>
         We may change the Terms at any time, but if we do, we will place a
         notice on our site located at{' '}
         <a href="https://comm.app">https://comm.app</a>. If you don’t agree with
         the new Terms, you are free to reject them; unfortunately, that means
         you will no longer be able to use the Services. If you use the Services
         in any way after a change to the Terms is effective, that means you
         agree to all of the changes.
       </p>
 
       <h2>What about my privacy?</h2>
 
       <p>
         For the current Comm Technologies Privacy Policy, please{' '}
         <a href="https://comm.app/privacy">click here</a>.
       </p>
 
       <h2>Minimum Age</h2>
 
       <p>
         You must be at least 13 years old to use our Services. The minimum age
         to use our services without parental approval may be higher in your home
         country.
       </p>
 
       <h2>What are the basics of using Comm?</h2>
 
       <p>
         In order to access Comm, you are required to sign up for an account and
         select a user name and password. You will not share your user name,
         account or password with anyone, and you must protect the security of
         your user name, account, password and any other access tools or
         credentials. You’re responsible for any activity associated with your
         user name and account.
       </p>
 
       <h2>Who will have access to my Content?</h2>
 
       <p>
         <strong>
           Comm Technologies does not have the ability to access, view or control
           anything you post, upload, share, store, or otherwise provide through
           the Services (your “Content”).
         </strong>{' '}
         However, other Comm users may have access to and control over your
         Content. For more information on how Comm works, please{' '}
         <a href="https://www.notion.so/How-Comm-works-d6217941db7c4237b9d08b427aef3234">
           click here
         </a>
         .
       </p>
 
       <h2>Are there restrictions in how I can use the Services?</h2>
 
       <p>
         You agree that you will not provide or contribute anything to the
         Services, or otherwise use or interact with the Services, in a manner
         that: (a) infringes or violates the right of Comm Technologies, or our
         users, or others, including intellectual property or other proprietary
         rights; or (b) violates any law or regulation, including without
         limitation, any applicable export control laws, privacy laws or any
         other purpose not reasonably intended by Comm Technologies.
       </p>
 
       <h2>What are my rights in the Services?</h2>
 
       <p>
         The Content displayed or performed or available on or through the
         Services may be protected by copyright and/or other intellectual
         property laws. You promise to abide by all copyright notices, trademark
         rules, information, and restrictions contained in any Content you access
         through the Services, and you won’t use, copy, reproduce, modify,
         translate, publish, broadcast, transmit, distribute, perform, upload,
         display, license, sell, commercialize or otherwise exploit for any
         purpose any Content not owned by you, (i) without the prior consent of
         the owner of that Content or (ii) in a way that violates someone else’s
-        (including Comm Technologies&apos;) rights. You further agree to comply
+        (including Comm Technologies&rsquo;) rights. You further agree to comply
         with all applicable open source licenses.
       </p>
 
       <p>
         Subject to these Terms, we grant each user of the Services a worldwide,
         non-exclusive, non-sublicensable and non-transferable license to use the
         Services.
       </p>
 
       <h2>Who is responsible for what is contributed to the Services?</h2>
 
       <p>
         Any information or Content posted or transmitted through the Services is
         the sole responsibility of the person from whom such Content originated,
         and you access all such information and Content at your own risk, and we
         aren’t liable for any errors or omissions in that information or Content
         or for any damages or loss you might suffer in connection with it.
       </p>
 
       <h2>
         What if I see something on the Services that infringes my copyright?
       </h2>
 
       <p>
         Comm Technologies does not host and has no access to or control over any
         Content provided through the Services and has no ability to remove any
         such Content. If you have any further questions, please contact{' '}
         <a href="mailto:support@comm.app">support@comm.app</a>.
       </p>
 
       <h2>Who is responsible for third-party services?</h2>
 
       <p>
         The Services may contain links or connections to third-party websites or
         services that are not owned or controlled by Comm Technologies. When you
         access third-party websites or use third-party services, you accept that
         there are risks in doing so, and that Comm Technologies is not
         responsible for such risks. We encourage you to be aware when you leave
         the Services and to read the terms and conditions and privacy policy of
         each third-party website or service that you visit or utilize.
       </p>
 
       <h2>Will Comm Technologies ever change the Services?</h2>
 
       <p>
         We’re always trying to improve our Services, so they may change over
         time. We may suspend or discontinue any part of the Services, or we may
         introduce new features or impose limits on certain features or restrict
         access to parts or all of the Services.
       </p>
 
       <h2>What if I want to stop using the Services?</h2>
 
       <p>
         You’re free to do that at any time, either by deleting your account
         within the app, or by contacting us at{' '}
         <a href="mailto:support@comm.app">support@comm.app</a>; please refer to
         our <a href="https://comm.app/privacy">Privacy Policy</a>, as well as
         the licenses above, to understand how we treat information you provide
         to us after you have stopped using our Services. Termination of your
         account may or may not result in destruction of Content associated with
         your account, and other Comm users may continue to have access to and
         control over your Content.
       </p>
 
       <p>
         Comm Technologies is also free to terminate (or suspend access to) your
         use of the Services or your account for any reason at our discretion,
         including your breach of these Terms. Comm Technologies has the sole
         right to decide whether you are in violation of any of the restrictions
         set forth in these Terms.
       </p>
 
       <p>
         Provisions that, by their nature, should survive termination of these
         Terms shall survive termination. By way of example, all of the following
         will survive termination: any limitations on our liability, any terms
         regarding ownership or intellectual property rights, and terms regarding
         disputes between us.
       </p>
 
       <h2>What else do I need to know?</h2>
 
       <h2>Warranty Disclaimer.</h2>
 
       <p>
         Comm Technologies and its licensors, suppliers, partners, parent,
         subsidiaries or affiliated entities, and each of their respective
         officers, directors, members, employees, consultants, contract
         employees, representatives and agents, and each of their respective
         successors and assigns (Comm Technologies and all such parties together,
         the “Comm Technologies Parties”) make no representations or warranties
         concerning the Services, including without limitation regarding any
         content contained in or accessed through the Services, and the Comm
         Technologies Parties will not be responsible or liable for the accuracy,
         copyright compliance, legality, or decency of material contained in or
         accessed through the Services or any claims, actions, suits procedures,
         costs, expenses, damages or liabilities arising out of use of, or in any
         way related to your participation in, the Services. The Comm
         Technologies Parties make no representations or warranties regarding
         suggestions or recommendations of services or products offered or
         purchased through or in connection with the Services. THE SERVICES AND
         CONTENT ARE PROVIDED BY COMM TECHNOLOGIES (AND ITS LICENSORS AND
         SUPPLIERS) ON AN “AS-IS” BASIS, WITHOUT WARRANTIES OF ANY KIND, EITHER
         EXPRESS OR IMPLIED, INCLUDING, WITHOUT LIMITATION, IMPLIED WARRANTIES OF
         MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, NON- INFRINGEMENT, OR
         THAT USE OF THE SERVICES WILL BE UNINTERRUPTED OR ERROR-FREE. SOME
         STATES DO NOT ALLOW LIMITATIONS ON HOW LONG AN IMPLIED WARRANTY LASTS,
         SO THE ABOVE LIMITATIONS MAY NOT APPLY TO YOU. WE DO NOT CONTROL, AND
         ARE NOT RESPONSIBLE FOR, CONTROLLING HOW OR WHEN OUR USERS USE OUR
         SERVICES. WE ARE NOT RESPONSIBLE FOR THE ACTIONS OR INFORMATION
         (INCLUDING CONTENT) OF OUR USERS OR OTHER THIRD PARTIES.
       </p>
 
       <h2>Limitation of Liability.</h2>
 
       <p>
         TO THE FULLEST EXTENT ALLOWED BY APPLICABLE LAW, UNDER NO CIRCUMSTANCES
         AND UNDER NO LEGAL THEORY (INCLUDING, WITHOUT LIMITATION, TORT,
         CONTRACT, STRICT LIABILITY, OR OTHERWISE) SHALL ANY OF THE COMM
         TECHNOLOGIES PARTIES BE LIABLE TO YOU OR TO ANY OTHER PERSON FOR (A) ANY
         INDIRECT, SPECIAL, INCIDENTAL, PUNITIVE OR CONSEQUENTIAL DAMAGES OF ANY
         KIND, INCLUDING DAMAGES FOR LOST PROFITS, BUSINESS INTERRUPTION, LOSS OF
         DATA, LOSS OF GOODWILL, WORK STOPPAGE, ACCURACY OF RESULTS, OR COMPUTER
         FAILURE OR MALFUNCTION, (B) ANY SUBSTITUTE GOODS, SERVICES OR
         TECHNOLOGY, (C) ANY AMOUNT, IN THE AGGREGATE, IN EXCESS OF THE GREATER
         OF (I) ONE-HUNDRED ($100) DOLLARS OR (II) THE AMOUNTS PAID AND/OR
         PAYABLE BY YOU TO COMM TECHNOLOGIES THE IN CONNECTION WITH THE SERVICES
         IN THE TWELVE (12) MONTH PERIOD PRECEDING THIS APPLICABLE CLAIM OR (D)
         ANY MATTER BEYOND OUR REASONABLE CONTROL. SOME STATES DO NOT ALLOW THE
         EXCLUSION OR LIMITATION OF INCIDENTAL OR CONSEQUENTIAL OR CERTAIN OTHER
         DAMAGES, SO ABOVE LIMITATION AND EXCLUSIONS MAY NOT APPLY TO YOU.
       </p>
 
       <h2>Assignment.</h2>
 
       <p>
         You may not assign, delegate or transfer these Terms or your rights or
         obligations hereunder, or your Services account, in any way (by
-        operation of law or otherwise) without Comm Technologies&apos; prior
+        operation of law or otherwise) without Comm Technologies&rsquo; prior
         written consent. We may transfer, assign, or delegate these Terms and
         our rights and obligations without consent.
       </p>
 
       <h2>Dispute Resolution.</h2>
 
       <p>
         These Terms are governed by and will be construed under the laws of the
         State of New York, without regard to the conflict of laws provisions
         thereof. Any legal action or proceeding relating to these Terms shall be
         brought exclusively in the state or federal courts located in New York
         County, New York, and each party consents to the jurisdiction thereof.
       </p>
 
       <h2>Miscellaneous</h2>
 
       <p>
         The failure of either you or us to exercise, in any way, any right
         herein shall not be deemed a waiver of any further rights hereunder. If
         any provision of these Terms are found to be unenforceable or invalid,
         that provision will be limited or eliminated, to the minimum extent
         necessary, so that these Terms shall otherwise remain in full force and
         effect and enforceable. You and Comm Technologies agree that these Terms
         are the complete and exclusive statement of the mutual understanding
         between you and Comm Technologies, and that these Terms supersede and
         cancel all previous written and oral agreements, communications and
         other understandings relating to the subject matter of these Terms. You
         hereby acknowledge and agree that you are not an employee, agent,
         partner, or joint venture of Comm Technologies, and you do not have any
         authority of any kind to bind Comm Technologies in any respect
         whatsoever.
       </p>
     </div>
   );
 }
 
 export default Terms;
diff --git a/native/account/registration/connect-ethereum.react.js b/native/account/registration/connect-ethereum.react.js
index 4302f3b7f..4342e25dc 100644
--- a/native/account/registration/connect-ethereum.react.js
+++ b/native/account/registration/connect-ethereum.react.js
@@ -1,219 +1,219 @@
 // @flow
 
 import * as React from 'react';
 import { Text, View } from 'react-native';
 
 import {
   exactSearchUser,
   exactSearchUserActionTypes,
 } from 'lib/actions/user-actions.js';
 import type { SIWEResult } from 'lib/types/siwe-types.js';
 import {
   useServerCall,
   useDispatchActionPromise,
 } from 'lib/utils/action-utils.js';
 
 import RegistrationButtonContainer from './registration-button-container.react.js';
 import RegistrationButton from './registration-button.react.js';
 import RegistrationContainer from './registration-container.react.js';
 import RegistrationContentContainer from './registration-content-container.react.js';
 import type { RegistrationNavigationProp } from './registration-navigator.react.js';
 import type { CoolOrNerdMode } from './registration-types.js';
 import {
   type NavigationRoute,
   ExistingEthereumAccountRouteName,
 } from '../../navigation/route-names.js';
 import { useStyles } from '../../themes/colors.js';
 import EthereumLogoDark from '../../vectors/ethereum-logo-dark.react.js';
 import SIWEPanel from '../siwe-panel.react.js';
 
 export type ConnectEthereumParams = {
   +userSelections: {
     +coolOrNerdMode: CoolOrNerdMode,
     +keyserverUsername: string,
   },
 };
 
 type PanelState = 'closed' | 'opening' | 'open' | 'closing';
 
 type Props = {
   +navigation: RegistrationNavigationProp<'ConnectEthereum'>,
   +route: NavigationRoute<'ConnectEthereum'>,
 };
 function ConnectEthereum(props: Props): React.Node {
   const isNerdMode =
     props.route.params.userSelections.coolOrNerdMode === 'nerd';
   const styles = useStyles(unboundStyles);
 
   let body;
   if (!isNerdMode) {
     body = (
       <Text style={styles.body}>
         Connecting your Ethereum wallet allows you to use your ENS name and
-        avatar in the app. You&apos;ll also be able to log in with your wallet
+        avatar in the app. You&rsquo;ll also be able to log in with your wallet
         instead of a password.
       </Text>
     );
   } else {
     body = (
       <>
         <Text style={styles.body}>
           Connecting your Ethereum wallet has three benefits:
         </Text>
         <View style={styles.list}>
           <View style={styles.listItem}>
             <Text style={styles.listItemNumber}>{'1. '}</Text>
             <Text style={styles.listItemContent}>
               Your peers will be able to cryptographically verify that your Comm
               account is associated with your Ethereum wallet.
             </Text>
           </View>
           <View style={styles.listItem}>
             <Text style={styles.listItemNumber}>{'2. '}</Text>
             <Text style={styles.listItemContent}>
-              You&apos;ll be able to use your ENS name and avatar in the app.
+              You&rsquo;ll be able to use your ENS name and avatar in the app.
             </Text>
           </View>
           <View style={styles.listItem}>
             <Text style={styles.listItemNumber}>{'3. '}</Text>
             <Text style={styles.listItemContent}>
               You can choose to skip setting a password, and to log in with your
               Ethereum wallet instead.
             </Text>
           </View>
         </View>
       </>
     );
   }
 
   const [panelState, setPanelState] = React.useState<PanelState>('closed');
   const openPanel = React.useCallback(() => {
     setPanelState('opening');
   }, []);
   const onPanelClosed = React.useCallback(() => {
     setPanelState('closed');
   }, []);
   const onPanelClosing = React.useCallback(() => {
     setPanelState('closing');
   }, []);
 
   const siwePanelSetLoading = React.useCallback(
     (loading: boolean) => {
       if (panelState === 'closing' || panelState === 'closed') {
         return;
       }
       setPanelState(loading ? 'opening' : 'open');
     },
     [panelState],
   );
 
   const onSkip = React.useCallback(() => {
     // show username selection screen
   }, []);
 
   const exactSearchUserCall = useServerCall(exactSearchUser);
   const dispatchActionPromise = useDispatchActionPromise();
 
   const { navigate } = props.navigation;
   const onSuccessfulWalletSignature = React.useCallback(
     async (result: SIWEResult) => {
       const searchPromise = exactSearchUserCall(result.address);
       dispatchActionPromise(exactSearchUserActionTypes, searchPromise);
       const { userInfo } = await searchPromise;
 
       if (userInfo) {
         navigate<'ExistingEthereumAccount'>({
           name: ExistingEthereumAccountRouteName,
           params: result,
         });
       } else {
         // show avatar selection screen
       }
     },
     [exactSearchUserCall, dispatchActionPromise, navigate],
   );
 
   let siwePanel;
   if (panelState !== 'closed') {
     siwePanel = (
       <SIWEPanel
         onClosing={onPanelClosing}
         onClosed={onPanelClosed}
         closing={panelState === 'closing'}
         onSuccessfulWalletSignature={onSuccessfulWalletSignature}
         setLoading={siwePanelSetLoading}
       />
     );
   }
 
   return (
     <>
       <RegistrationContainer>
         <RegistrationContentContainer style={styles.scrollViewContentContainer}>
           <Text style={styles.header}>
             Do you want to connect an Ethereum wallet?
           </Text>
           {body}
           <View style={styles.ethereumLogoContainer}>
             <EthereumLogoDark />
           </View>
         </RegistrationContentContainer>
         <RegistrationButtonContainer>
           <RegistrationButton
             onPress={openPanel}
             label="Connect Ethereum wallet"
             variant={panelState === 'opening' ? 'loading' : 'enabled'}
           />
           <RegistrationButton
             onPress={onSkip}
             label="Do not connect"
             variant="outline"
           />
         </RegistrationButtonContainer>
       </RegistrationContainer>
       {siwePanel}
     </>
   );
 }
 
 const unboundStyles = {
   scrollViewContentContainer: {
     flexGrow: 1,
   },
   header: {
     fontSize: 24,
     color: 'panelForegroundLabel',
     paddingBottom: 16,
   },
   body: {
     fontSize: 15,
     lineHeight: 20,
     color: 'panelForegroundSecondaryLabel',
     paddingBottom: 16,
   },
   ethereumLogoContainer: {
     flexGrow: 1,
     alignItems: 'center',
     justifyContent: 'center',
   },
   list: {
     paddingBottom: 16,
   },
   listItem: {
     flexDirection: 'row',
   },
   listItemNumber: {
     fontWeight: 'bold',
     fontSize: 15,
     lineHeight: 20,
     color: 'panelForegroundSecondaryLabel',
   },
   listItemContent: {
     flexShrink: 1,
     fontSize: 15,
     lineHeight: 20,
     color: 'panelForegroundSecondaryLabel',
   },
 };
 
 export default ConnectEthereum;
diff --git a/native/account/terms-and-privacy-modal.react.js b/native/account/terms-and-privacy-modal.react.js
index f7e2adfc3..fa970c243 100644
--- a/native/account/terms-and-privacy-modal.react.js
+++ b/native/account/terms-and-privacy-modal.react.js
@@ -1,190 +1,190 @@
 // @flow
 
 import { useIsFocused } from '@react-navigation/native';
 import * as React from 'react';
 import {
   ActivityIndicator,
   BackHandler,
   Linking,
   Platform,
   Text,
   View,
 } from 'react-native';
 
 import {
   policyAcknowledgment,
   policyAcknowledgmentActionTypes,
 } from 'lib/actions/user-actions.js';
 import { type PolicyType, policyTypes } from 'lib/facts/policies.js';
 import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
 import {
   useDispatchActionPromise,
   useServerCall,
 } from 'lib/utils/action-utils.js';
 import { acknowledgePolicy } from 'lib/utils/policy-acknowledge-utlis.js';
 
 import Button from '../components/button.react.js';
 import Modal from '../components/modal.react.js';
 import type { RootNavigationProp } from '../navigation/root-navigator.react.js';
 import type { NavigationRoute } from '../navigation/route-names.js';
 import { useSelector } from '../redux/redux-utils.js';
 import { useStyles } from '../themes/colors.js';
 
 export type TermsAndPrivacyModalParams = {
   +policyType: PolicyType,
 };
 
 type Props = {
   +navigation: RootNavigationProp<'TermsAndPrivacyModal'>,
   +route: NavigationRoute<'TermsAndPrivacyModal'>,
 };
 
 const loadingStatusSelector = createLoadingStatusSelector(
   policyAcknowledgmentActionTypes,
 );
 
 function TermsAndPrivacyModal(props: Props): React.Node {
   const loadingStatus = useSelector(loadingStatusSelector);
   const [acknowledgmentError, setAcknowledgmentError] = React.useState('');
   const sendAcknowledgmentRequest = useServerCall(policyAcknowledgment);
   const dispatchActionPromise = useDispatchActionPromise();
 
   const policyType = props.route.params.policyType;
   const policyState = useSelector(store => store.userPolicies[policyType]);
   const isAcknowledged = policyState?.isAcknowledged;
   const isFocused = useIsFocused();
 
   React.useEffect(() => {
     if (isAcknowledged && isFocused) {
       props.navigation.goBack();
     }
   }, [isAcknowledged, props.navigation, isFocused]);
 
   const onAccept = React.useCallback(() => {
     acknowledgePolicy(
       policyTypes.tosAndPrivacyPolicy,
       dispatchActionPromise,
       sendAcknowledgmentRequest,
       setAcknowledgmentError,
     );
   }, [dispatchActionPromise, sendAcknowledgmentRequest]);
 
   const styles = useStyles(unboundStyles);
 
   const buttonContent = React.useMemo(() => {
     if (loadingStatus === 'loading') {
       return (
         <View style={styles.loading}>
           <ActivityIndicator size="small" color="#D3D3D3" />
         </View>
       );
     }
     return <Text style={styles.buttonText}>I accept</Text>;
   }, [loadingStatus, styles.buttonText, styles.loading]);
 
   const onBackPress = props.navigation.isFocused;
   React.useEffect(() => {
     BackHandler.addEventListener('hardwareBackPress', onBackPress);
     return () => {
       BackHandler.removeEventListener('hardwareBackPress', onBackPress);
     };
   }, [onBackPress]);
 
   const safeAreaEdges = ['top', 'bottom'];
   return (
     <Modal
       disableClosing={true}
       modalStyle={styles.modal}
       safeAreaEdges={safeAreaEdges}
     >
       <Text style={styles.header}>Terms of Service and Privacy Policy</Text>
       <Text style={styles.label}>
         <Text>We recently updated our&nbsp;</Text>
         <Text style={styles.link} onPress={onTermsOfUsePressed}>
           Terms of Service
         </Text>
         <Text>&nbsp;&amp;&nbsp;</Text>
         <Text style={styles.link} onPress={onPrivacyPolicyPressed}>
           Privacy Policy
         </Text>
         <Text>
-          . In order to continue using Comm, we&apos;re asking you to read
+          . In order to continue using Comm, we&rsquo;re asking you to read
           through, acknowledge, and accept the updated policies.
         </Text>
       </Text>
 
       <View style={styles.buttonsContainer}>
         <Button style={styles.button} onPress={onAccept}>
           <Text style={styles.buttonText}>{buttonContent}</Text>
         </Button>
         <Text style={styles.error}>{acknowledgmentError}</Text>
       </View>
     </Modal>
   );
 }
 
 const unboundStyles = {
   modal: {
     backgroundColor: 'modalForeground',
     paddingBottom: 10,
     paddingTop: 32,
     paddingHorizontal: 32,
     flex: 0,
     borderColor: 'modalForegroundBorder',
   },
   header: {
     color: 'modalForegroundLabel',
     fontSize: 20,
     fontWeight: '600',
     textAlign: 'center',
     paddingBottom: 16,
   },
   label: {
     color: 'modalForegroundSecondaryLabel',
     fontSize: 16,
     lineHeight: 20,
     textAlign: 'center',
   },
   link: {
     color: 'purpleLink',
     fontWeight: 'bold',
   },
   buttonsContainer: {
     flexDirection: 'column',
     marginTop: 24,
     height: 72,
     paddingHorizontal: 16,
   },
   button: {
     borderRadius: 5,
     height: 48,
     justifyContent: 'center',
     alignItems: 'center',
     backgroundColor: 'purpleButton',
   },
   buttonText: {
     color: 'white',
     fontSize: 16,
     fontWeight: '600',
     textAlign: 'center',
   },
   error: {
     marginTop: 6,
     fontStyle: 'italic',
     color: 'redText',
     textAlign: 'center',
   },
   loading: {
     paddingTop: Platform.OS === 'android' ? 0 : 6,
   },
 };
 
 const onTermsOfUsePressed = () => {
   Linking.openURL('https://comm.app/terms');
 };
 
 const onPrivacyPolicyPressed = () => {
   Linking.openURL('https://comm.app/privacy');
 };
 
 export default TermsAndPrivacyModal;
diff --git a/native/chat/chat-input-bar.react.js b/native/chat/chat-input-bar.react.js
index d1424369b..84aef3813 100644
--- a/native/chat/chat-input-bar.react.js
+++ b/native/chat/chat-input-bar.react.js
@@ -1,1309 +1,1309 @@
 // @flow
 
 import Icon from '@expo/vector-icons/Ionicons.js';
 import invariant from 'invariant';
 import _throttle from 'lodash/throttle.js';
 import * as React from 'react';
 import {
   View,
   TextInput,
   TouchableOpacity,
   Platform,
   Text,
   ActivityIndicator,
   TouchableWithoutFeedback,
   NativeAppEventEmitter,
 } from 'react-native';
 import Alert from 'react-native/Libraries/Alert/Alert.js';
 import { TextInputKeyboardMangerIOS } from 'react-native-keyboard-input';
 import Animated, {
   EasingNode,
   FadeInDown,
   FadeOutDown,
 } from 'react-native-reanimated';
 import { useDispatch } from 'react-redux';
 
 import {
   moveDraftActionType,
   updateDraftActionType,
 } from 'lib/actions/draft-actions.js';
 import {
   joinThreadActionTypes,
   joinThread,
   newThreadActionTypes,
 } from 'lib/actions/thread-actions.js';
 import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
 import { threadInfoSelector } from 'lib/selectors/thread-selectors.js';
 import { userStoreSearchIndex } from 'lib/selectors/user-selectors.js';
 import { colorIsDark } from 'lib/shared/color-utils.js';
 import { useEditMessage } from 'lib/shared/edit-messages-utils.js';
 import {
   getTypeaheadUserSuggestions,
   getTypeaheadRegexMatches,
   type Selection,
   getMentionsCandidates,
 } from 'lib/shared/mention-utils.js';
 import {
   localIDPrefix,
   trimMessage,
   useMessagePreview,
   messageKey,
   type MessagePreviewResult,
 } from 'lib/shared/message-utils.js';
 import SearchIndex from 'lib/shared/search-index.js';
 import {
   threadHasPermission,
   viewerIsMember,
   threadFrozenDueToViewerBlock,
   threadActualMembers,
   checkIfDefaultMembersAreVoiced,
   draftKeyFromThreadID,
 } from 'lib/shared/thread-utils.js';
 import type { CalendarQuery } from 'lib/types/entry-types.js';
 import type { LoadingStatus } from 'lib/types/loading-types.js';
 import type { PhotoPaste } from 'lib/types/media-types.js';
 import { messageTypes } from 'lib/types/message-types-enum.js';
 import type {
   SendEditMessageResponse,
   MessageInfo,
 } from 'lib/types/message-types.js';
 import type { Dispatch } from 'lib/types/redux-types.js';
 import { threadPermissions } from 'lib/types/thread-permission-types.js';
 import {
   type ThreadInfo,
   type ClientThreadJoinRequest,
   type ThreadJoinPayload,
   type RelativeMemberInfo,
 } from 'lib/types/thread-types.js';
 import { type UserInfos } from 'lib/types/user-types.js';
 import {
   type DispatchActionPromise,
   useServerCall,
   useDispatchActionPromise,
 } from 'lib/utils/action-utils.js';
 
 import { ChatContext } from './chat-context.js';
 import type { ChatNavigationProp } from './chat.react.js';
 import TypeaheadTooltip from './typeahead-tooltip.react.js';
 import Button from '../components/button.react.js';
 // eslint-disable-next-line import/extensions
 import ClearableTextInput from '../components/clearable-text-input.react';
 import type { SyncedSelectionData } from '../components/selectable-text-input.js';
 // eslint-disable-next-line import/extensions
 import SelectableTextInput from '../components/selectable-text-input.react';
 import { SingleLine } from '../components/single-line.react.js';
 import SWMansionIcon from '../components/swmansion-icon.react.js';
 import {
   type InputState,
   InputStateContext,
   type EditInputBarMessageParameters,
 } from '../input/input-state.js';
 import KeyboardInputHost from '../keyboard/keyboard-input-host.react.js';
 import {
   type KeyboardState,
   KeyboardContext,
 } from '../keyboard/keyboard-state.js';
 import { getKeyboardHeight } from '../keyboard/keyboard.js';
 import { getDefaultTextMessageRules } from '../markdown/rules.react.js';
 import {
   nonThreadCalendarQuery,
   activeThreadSelector,
 } from '../navigation/nav-selectors.js';
 import { NavContext } from '../navigation/navigation-context.js';
 import {
   type NavigationRoute,
   ChatCameraModalRouteName,
   ImagePasteModalRouteName,
 } from '../navigation/route-names.js';
 import { useSelector } from '../redux/redux-utils.js';
 import { type Colors, useStyles, useColors } from '../themes/colors.js';
 import type { LayoutEvent } from '../types/react-native.js';
 import { type AnimatedViewStyle, AnimatedView } from '../types/styles.js';
 import { runTiming } from '../utils/animation-utils.js';
 import { exitEditAlert } from '../utils/edit-messages-utils.js';
 import { nativeTypeaheadRegex } from '../utils/typeahead-utils.js';
 
 /* eslint-disable import/no-named-as-default-member */
 const { Value, Clock, block, set, cond, neq, sub, interpolateNode, stopClock } =
   Animated;
 /* eslint-enable import/no-named-as-default-member */
 
 const expandoButtonsAnimationConfig = {
   duration: 150,
   easing: EasingNode.inOut(EasingNode.ease),
 };
 const sendButtonAnimationConfig = {
   duration: 150,
   easing: EasingNode.inOut(EasingNode.ease),
 };
 
 type BaseProps = {
   +threadInfo: ThreadInfo,
 };
 type Props = {
   ...BaseProps,
   +viewerID: ?string,
   +draft: string,
   +joinThreadLoadingStatus: LoadingStatus,
   +threadCreationInProgress: boolean,
   +calendarQuery: () => CalendarQuery,
   +nextLocalID: number,
   +userInfos: UserInfos,
   +colors: Colors,
   +styles: typeof unboundStyles,
   +onInputBarLayout?: (event: LayoutEvent) => mixed,
   +openCamera: () => mixed,
   +isActive: boolean,
   +keyboardState: ?KeyboardState,
   +dispatch: Dispatch,
   +dispatchActionPromise: DispatchActionPromise,
   +joinThread: (request: ClientThreadJoinRequest) => Promise<ThreadJoinPayload>,
   +inputState: ?InputState,
   +userSearchIndex: SearchIndex,
   +mentionsCandidates: $ReadOnlyArray<RelativeMemberInfo>,
   +parentThreadInfo: ?ThreadInfo,
   +editedMessagePreview: ?MessagePreviewResult,
   +editedMessageInfo: ?MessageInfo,
   +editMessage: (
     messageID: string,
     text: string,
   ) => Promise<SendEditMessageResponse>,
   +navigation: ?ChatNavigationProp<'MessageList'>,
 };
 type State = {
   +text: string,
   +textEdited: boolean,
   +buttonsExpanded: boolean,
   +selectionState: SyncedSelectionData,
   +isExitingEditMode: boolean,
 };
 class ChatInputBar extends React.PureComponent<Props, State> {
   textInput: ?React.ElementRef<typeof TextInput>;
   clearableTextInput: ?ClearableTextInput;
   selectableTextInput: ?React.ElementRef<typeof SelectableTextInput>;
 
   expandoButtonsOpen: Value;
   targetExpandoButtonsOpen: Value;
   expandoButtonsStyle: AnimatedViewStyle;
   cameraRollIconStyle: AnimatedViewStyle;
   cameraIconStyle: AnimatedViewStyle;
   expandIconStyle: AnimatedViewStyle;
 
   sendButtonContainerOpen: Value;
   targetSendButtonContainerOpen: Value;
   sendButtonContainerStyle: AnimatedViewStyle;
 
   clearBeforeRemoveListener: () => void;
 
   constructor(props: Props) {
     super(props);
     this.state = {
       text: props.draft,
       textEdited: false,
       buttonsExpanded: true,
       selectionState: { text: props.draft, selection: { start: 0, end: 0 } },
       isExitingEditMode: false,
     };
 
     this.setUpActionIconAnimations();
     this.setUpSendIconAnimations();
   }
 
   setUpActionIconAnimations() {
     this.expandoButtonsOpen = new Value(1);
     this.targetExpandoButtonsOpen = new Value(1);
     const prevTargetExpandoButtonsOpen = new Value(1);
     const expandoButtonClock = new Clock();
     const expandoButtonsOpen = block([
       cond(neq(this.targetExpandoButtonsOpen, prevTargetExpandoButtonsOpen), [
         stopClock(expandoButtonClock),
         set(prevTargetExpandoButtonsOpen, this.targetExpandoButtonsOpen),
       ]),
       cond(
         neq(this.expandoButtonsOpen, this.targetExpandoButtonsOpen),
         set(
           this.expandoButtonsOpen,
           runTiming(
             expandoButtonClock,
             this.expandoButtonsOpen,
             this.targetExpandoButtonsOpen,
             true,
             expandoButtonsAnimationConfig,
           ),
         ),
       ),
       this.expandoButtonsOpen,
     ]);
 
     this.cameraRollIconStyle = {
       ...unboundStyles.cameraRollIcon,
       opacity: expandoButtonsOpen,
     };
     this.cameraIconStyle = {
       ...unboundStyles.cameraIcon,
       opacity: expandoButtonsOpen,
     };
 
     const expandoButtonsWidth = interpolateNode(expandoButtonsOpen, {
       inputRange: [0, 1],
       outputRange: [26, 66],
     });
     this.expandoButtonsStyle = {
       ...unboundStyles.expandoButtons,
       width: expandoButtonsWidth,
     };
 
     const expandOpacity = sub(1, expandoButtonsOpen);
     this.expandIconStyle = {
       ...unboundStyles.expandIcon,
       opacity: expandOpacity,
     };
   }
 
   setUpSendIconAnimations() {
     const initialSendButtonContainerOpen = trimMessage(this.props.draft)
       ? 1
       : 0;
     this.sendButtonContainerOpen = new Value(initialSendButtonContainerOpen);
     this.targetSendButtonContainerOpen = new Value(
       initialSendButtonContainerOpen,
     );
     const prevTargetSendButtonContainerOpen = new Value(
       initialSendButtonContainerOpen,
     );
     const sendButtonClock = new Clock();
     const sendButtonContainerOpen = block([
       cond(
         neq(
           this.targetSendButtonContainerOpen,
           prevTargetSendButtonContainerOpen,
         ),
         [
           stopClock(sendButtonClock),
           set(
             prevTargetSendButtonContainerOpen,
             this.targetSendButtonContainerOpen,
           ),
         ],
       ),
       cond(
         neq(this.sendButtonContainerOpen, this.targetSendButtonContainerOpen),
         set(
           this.sendButtonContainerOpen,
           runTiming(
             sendButtonClock,
             this.sendButtonContainerOpen,
             this.targetSendButtonContainerOpen,
             true,
             sendButtonAnimationConfig,
           ),
         ),
       ),
       this.sendButtonContainerOpen,
     ]);
 
     const sendButtonContainerWidth = interpolateNode(sendButtonContainerOpen, {
       inputRange: [0, 1],
       outputRange: [4, 38],
     });
     this.sendButtonContainerStyle = { width: sendButtonContainerWidth };
   }
 
   static mediaGalleryOpen(props: Props) {
     const { keyboardState } = props;
     return !!(keyboardState && keyboardState.mediaGalleryOpen);
   }
 
   static systemKeyboardShowing(props: Props) {
     const { keyboardState } = props;
     return !!(keyboardState && keyboardState.systemKeyboardShowing);
   }
 
   get systemKeyboardShowing() {
     return ChatInputBar.systemKeyboardShowing(this.props);
   }
 
   immediatelyShowSendButton() {
     this.sendButtonContainerOpen.setValue(1);
     this.targetSendButtonContainerOpen.setValue(1);
   }
 
   updateSendButton(currentText: string) {
     if (this.shouldShowTextInput) {
       this.targetSendButtonContainerOpen.setValue(currentText === '' ? 0 : 1);
     } else {
       this.setUpSendIconAnimations();
     }
   }
 
   componentDidMount() {
     if (this.props.isActive) {
       this.addEditInputMessageListener();
     }
     if (this.props.navigation) {
       this.clearBeforeRemoveListener = this.props.navigation.addListener(
         'beforeRemove',
         this.onNavigationBeforeRemove,
       );
     }
   }
 
   componentWillUnmount() {
     if (this.props.isActive) {
       this.removeEditInputMessageListener();
     }
     if (this.clearBeforeRemoveListener) {
       this.clearBeforeRemoveListener();
     }
   }
 
   componentDidUpdate(prevProps: Props, prevState: State) {
     if (
       this.state.textEdited &&
       this.state.text &&
       this.props.threadInfo.id !== prevProps.threadInfo.id
     ) {
       this.props.dispatch({
         type: moveDraftActionType,
         payload: {
           oldKey: draftKeyFromThreadID(prevProps.threadInfo.id),
           newKey: draftKeyFromThreadID(this.props.threadInfo.id),
         },
       });
     } else if (!this.state.textEdited && this.props.draft !== prevProps.draft) {
       this.setState({ text: this.props.draft });
     }
     if (this.props.isActive && !prevProps.isActive) {
       this.addEditInputMessageListener();
     } else if (!this.props.isActive && prevProps.isActive) {
       this.removeEditInputMessageListener();
     }
 
     const currentText = trimMessage(this.state.text);
     const prevText = trimMessage(prevState.text);
 
     if (
       (currentText === '' && prevText !== '') ||
       (currentText !== '' && prevText === '')
     ) {
       this.updateSendButton(currentText);
     }
 
     const systemKeyboardIsShowing = ChatInputBar.systemKeyboardShowing(
       this.props,
     );
     const systemKeyboardWasShowing =
       ChatInputBar.systemKeyboardShowing(prevProps);
     if (systemKeyboardIsShowing && !systemKeyboardWasShowing) {
       this.hideButtons();
     } else if (!systemKeyboardIsShowing && systemKeyboardWasShowing) {
       this.expandButtons();
     }
 
     const imageGalleryIsOpen = ChatInputBar.mediaGalleryOpen(this.props);
     const imageGalleryWasOpen = ChatInputBar.mediaGalleryOpen(prevProps);
     if (!imageGalleryIsOpen && imageGalleryWasOpen) {
       this.hideButtons();
     } else if (imageGalleryIsOpen && !imageGalleryWasOpen) {
       this.expandButtons();
       this.setIOSKeyboardHeight();
     }
   }
 
   addEditInputMessageListener() {
     invariant(
       this.props.inputState,
       'inputState should be set in addEditInputMessageListener',
     );
     this.props.inputState.addEditInputMessageListener(this.focusAndUpdateText);
   }
 
   removeEditInputMessageListener() {
     invariant(
       this.props.inputState,
       'inputState should be set in removeEditInputMessageListener',
     );
     this.props.inputState.removeEditInputMessageListener(
       this.focusAndUpdateText,
     );
   }
 
   setIOSKeyboardHeight() {
     if (Platform.OS !== 'ios') {
       return;
     }
     const { textInput } = this;
     if (!textInput) {
       return;
     }
     const keyboardHeight = getKeyboardHeight();
     if (keyboardHeight === null || keyboardHeight === undefined) {
       return;
     }
     TextInputKeyboardMangerIOS.setKeyboardHeight(textInput, keyboardHeight);
   }
 
   get shouldShowTextInput(): boolean {
     if (threadHasPermission(this.props.threadInfo, threadPermissions.VOICED)) {
       return true;
     }
     // If the thread is created by somebody else while the viewer is attempting
     // to create it, the threadInfo might be modified in-place
     // and won't list the viewer as a member,
     // which will end up hiding the input.
     // In this case, we will assume that our creation action
     // will get translated into a join, and as long
     // as members are voiced, we can show the input.
     if (!this.props.threadCreationInProgress) {
       return false;
     }
     return checkIfDefaultMembersAreVoiced(this.props.threadInfo);
   }
 
   render() {
     const isMember = viewerIsMember(this.props.threadInfo);
     const canJoin = threadHasPermission(
       this.props.threadInfo,
       threadPermissions.JOIN_THREAD,
     );
     let joinButton = null;
     const threadColor = `#${this.props.threadInfo.color}`;
     const isEditMode = this.isEditMode();
     if (!isMember && canJoin && !this.props.threadCreationInProgress) {
       let buttonContent;
       if (this.props.joinThreadLoadingStatus === 'loading') {
         buttonContent = (
           <ActivityIndicator
             size="small"
             color="white"
             style={this.props.styles.joinThreadLoadingIndicator}
           />
         );
       } else {
         const textStyle = colorIsDark(this.props.threadInfo.color)
           ? this.props.styles.joinButtonTextLight
           : this.props.styles.joinButtonTextDark;
         buttonContent = (
           <View style={this.props.styles.joinButtonContent}>
             <SWMansionIcon name="plus" style={textStyle} />
             <Text style={textStyle}>Join Chat</Text>
           </View>
         );
       }
       joinButton = (
         <View style={this.props.styles.joinButtonContainer}>
           <Button
             onPress={this.onPressJoin}
             iosActiveOpacity={0.85}
             style={[
               this.props.styles.joinButton,
               { backgroundColor: threadColor },
             ]}
           >
             {buttonContent}
           </Button>
         </View>
       );
     }
 
     const typeaheadRegexMatches = getTypeaheadRegexMatches(
       this.state.selectionState.text,
       this.state.selectionState.selection,
       nativeTypeaheadRegex,
     );
 
     let typeaheadTooltip = null;
 
     if (typeaheadRegexMatches && !isEditMode) {
       const typeaheadMatchedStrings = {
         textBeforeAtSymbol: typeaheadRegexMatches[1] ?? '',
         usernamePrefix: typeaheadRegexMatches[4] ?? '',
       };
 
       const suggestedUsers = getTypeaheadUserSuggestions(
         this.props.userSearchIndex,
         this.props.mentionsCandidates,
         this.props.viewerID,
         typeaheadMatchedStrings.usernamePrefix,
       );
 
       if (suggestedUsers.length > 0) {
         typeaheadTooltip = (
           <TypeaheadTooltip
             text={this.state.text}
             matchedStrings={typeaheadMatchedStrings}
             suggestedUsers={suggestedUsers}
             focusAndUpdateTextAndSelection={this.focusAndUpdateTextAndSelection}
           />
         );
       }
     }
 
     let content;
     const defaultMembersAreVoiced = checkIfDefaultMembersAreVoiced(
       this.props.threadInfo,
     );
     if (this.shouldShowTextInput) {
       content = this.renderInput();
     } else if (
       threadFrozenDueToViewerBlock(
         this.props.threadInfo,
         this.props.viewerID,
         this.props.userInfos,
       ) &&
       threadActualMembers(this.props.threadInfo.members).length === 2
     ) {
       content = (
         <Text style={this.props.styles.explanation}>
-          You can&apos;t send messages to a user that you&apos;ve blocked.
+          You can&rsquo;t send messages to a user that you&rsquo;ve blocked.
         </Text>
       );
     } else if (isMember) {
       content = (
         <Text style={this.props.styles.explanation}>
-          You don&apos;t have permission to send messages.
+          You don&rsquo;t have permission to send messages.
         </Text>
       );
     } else if (defaultMembersAreVoiced && canJoin) {
       content = null;
     } else {
       content = (
         <Text style={this.props.styles.explanation}>
-          You don&apos;t have permission to send messages.
+          You don&rsquo;t have permission to send messages.
         </Text>
       );
     }
 
     const keyboardInputHost =
       Platform.OS === 'android' ? null : (
         <KeyboardInputHost textInputRef={this.textInput} />
       );
 
     let editedMessage;
     if (isEditMode && this.props.editedMessagePreview) {
       const { message } = this.props.editedMessagePreview;
       editedMessage = (
         <AnimatedView
           style={this.props.styles.editView}
           entering={FadeInDown}
           exiting={FadeOutDown}
         >
           <View style={this.props.styles.editViewContent}>
             <TouchableOpacity
               onPress={this.scrollToEditedMessage}
               activeOpacity={0.4}
             >
               <Text
                 style={[{ color: threadColor }, this.props.styles.editingLabel]}
               >
                 Editing message
               </Text>
               <SingleLine style={this.props.styles.editingMessagePreview}>
                 {message.text}
               </SingleLine>
             </TouchableOpacity>
           </View>
           <SWMansionIcon
             style={this.props.styles.exitEditButton}
             name="cross"
             size={22}
             color={threadColor}
             onPress={this.onPressExitEditMode}
           />
         </AnimatedView>
       );
     }
 
     return (
       <AnimatedView
         style={this.props.styles.container}
         onLayout={this.props.onInputBarLayout}
       >
         {typeaheadTooltip}
         {joinButton}
         {editedMessage}
         {content}
         {keyboardInputHost}
       </AnimatedView>
     );
   }
 
   renderInput() {
     const expandoButton = (
       <TouchableOpacity
         onPress={this.expandButtons}
         activeOpacity={0.4}
         style={this.props.styles.expandButton}
       >
         <AnimatedView style={this.expandIconStyle}>
           <SWMansionIcon
             name="chevron-right"
             size={22}
             color={`#${this.props.threadInfo.color}`}
           />
         </AnimatedView>
       </TouchableOpacity>
     );
     const threadColor = `#${this.props.threadInfo.color}`;
     const expandoButtonsViewStyle = [this.props.styles.innerExpandoButtons];
     if (this.isEditMode()) {
       expandoButtonsViewStyle.push({ display: 'none' });
     }
     return (
       <TouchableWithoutFeedback onPress={this.dismissKeyboard}>
         <View style={this.props.styles.inputContainer}>
           <AnimatedView style={this.expandoButtonsStyle}>
             <View style={expandoButtonsViewStyle}>
               {this.state.buttonsExpanded ? expandoButton : null}
               <TouchableOpacity
                 onPress={this.showMediaGallery}
                 activeOpacity={0.4}
               >
                 <AnimatedView style={this.cameraRollIconStyle}>
                   <SWMansionIcon
                     name="image-1"
                     size={28}
                     color={`#${this.props.threadInfo.color}`}
                   />
                 </AnimatedView>
               </TouchableOpacity>
               <TouchableOpacity
                 onPress={this.props.openCamera}
                 activeOpacity={0.4}
                 disabled={!this.state.buttonsExpanded}
               >
                 <AnimatedView style={this.cameraIconStyle}>
                   <SWMansionIcon
                     name="camera"
                     size={28}
                     color={`#${this.props.threadInfo.color}`}
                   />
                 </AnimatedView>
               </TouchableOpacity>
               {this.state.buttonsExpanded ? null : expandoButton}
             </View>
           </AnimatedView>
           <SelectableTextInput
             allowImagePasteForThreadID={this.props.threadInfo.id}
             value={this.state.text}
             onChangeText={this.updateText}
             selection={this.state.selectionState.selection}
             onUpdateSyncedSelectionData={this.updateSelectionState}
             placeholder="Send a message..."
             placeholderTextColor={this.props.colors.listInputButton}
             multiline={true}
             style={this.props.styles.textInput}
             textInputRef={this.textInputRef}
             clearableTextInputRef={this.clearableTextInputRef}
             ref={this.selectableTextInputRef}
             selectionColor={`#${this.props.threadInfo.color}`}
           />
           <AnimatedView style={this.sendButtonContainerStyle}>
             <TouchableOpacity
               onPress={this.onSend}
               activeOpacity={0.4}
               style={this.props.styles.sendButton}
               disabled={trimMessage(this.state.text) === ''}
             >
               <Icon
                 name="md-send"
                 size={25}
                 style={this.props.styles.sendIcon}
                 color={threadColor}
               />
             </TouchableOpacity>
           </AnimatedView>
         </View>
       </TouchableWithoutFeedback>
     );
   }
 
   textInputRef = (textInput: ?React.ElementRef<typeof TextInput>) => {
     this.textInput = textInput;
   };
 
   clearableTextInputRef = (clearableTextInput: ?ClearableTextInput) => {
     this.clearableTextInput = clearableTextInput;
   };
 
   selectableTextInputRef = (
     selectableTextInput: ?React.ElementRef<typeof SelectableTextInput>,
   ) => {
     this.selectableTextInput = selectableTextInput;
   };
 
   updateText = (text: string) => {
     this.setState({ text, textEdited: true });
     if (this.isEditMode() || this.state.isExitingEditMode) {
       return;
     }
     this.saveDraft(text);
   };
 
   updateSelectionState: (data: SyncedSelectionData) => void = data => {
     this.setState({ selectionState: data });
   };
 
   saveDraft = _throttle(text => {
     this.props.dispatch({
       type: updateDraftActionType,
       payload: {
         key: draftKeyFromThreadID(this.props.threadInfo.id),
         text,
       },
     });
   }, 400);
 
   focusAndUpdateTextAndSelection = (text: string, selection: Selection) => {
     this.selectableTextInput?.prepareForSelectionMutation(text, selection);
     this.setState({
       text,
       textEdited: true,
       selectionState: { text, selection },
     });
     this.saveDraft(text);
 
     this.focusAndUpdateButtonsVisibility();
   };
 
   focusAndUpdateText = (params: EditInputBarMessageParameters) => {
     const { message: text, mode } = params;
     const currentText = this.state.text;
     if (mode === 'replace') {
       this.updateText(text);
     } else if (!currentText.startsWith(text)) {
       const prependedText = text.concat(currentText);
       this.updateText(prependedText);
     }
 
     this.focusAndUpdateButtonsVisibility();
   };
 
   focusAndUpdateButtonsVisibility = () => {
     const { textInput } = this;
     if (!textInput) {
       return;
     }
 
     this.immediatelyShowSendButton();
     this.immediatelyHideButtons();
     textInput.focus();
   };
 
   onSend = async () => {
     if (!trimMessage(this.state.text)) {
       return;
     }
 
     const editedMessage = this.getEditedMessage();
     if (editedMessage && editedMessage.id) {
       this.editMessage(editedMessage.id, this.state.text);
       return;
     }
 
     this.updateSendButton('');
 
     const { clearableTextInput } = this;
     invariant(
       clearableTextInput,
       'clearableTextInput should be sent in onSend',
     );
     let text = await clearableTextInput.getValueAndReset();
     text = trimMessage(text);
     if (!text) {
       return;
     }
 
     const localID = `${localIDPrefix}${this.props.nextLocalID}`;
     const creatorID = this.props.viewerID;
     invariant(creatorID, 'should have viewer ID in order to send a message');
     invariant(
       this.props.inputState,
       'inputState should be set in ChatInputBar.onSend',
     );
 
     this.props.inputState.sendTextMessage(
       {
         type: messageTypes.TEXT,
         localID,
         threadID: this.props.threadInfo.id,
         text,
         creatorID,
         time: Date.now(),
       },
       this.props.threadInfo,
       this.props.parentThreadInfo,
     );
   };
 
   isEditMode = () => {
     const editState = this.props.inputState?.editState;
     const isThisThread =
       editState?.editedMessage?.threadID === this.props.threadInfo.id;
     return editState && editState.editedMessage !== null && isThisThread;
   };
 
   isMessageEdited = () => {
     let text = this.state.text;
     text = trimMessage(text);
     const originalText = this.props.editedMessageInfo?.text;
     return text !== originalText;
   };
 
   editMessage = async (messageID: string, text: string) => {
     if (!this.isMessageEdited()) {
       this.exitEditMode();
       return;
     }
     text = trimMessage(text);
     try {
       await this.props.editMessage(messageID, text);
       this.exitEditMode();
     } catch (error) {
       Alert.alert(
         'Couldn’t edit the message',
         'Please try again later',
         [{ text: 'OK' }],
         {
           cancelable: true,
         },
       );
     }
   };
 
   getEditedMessage = () => {
     const editState = this.props.inputState?.editState;
     return editState?.editedMessage;
   };
 
   onPressExitEditMode = () => {
     if (!this.isMessageEdited()) {
       this.exitEditMode();
       return;
     }
     exitEditAlert(this.exitEditMode);
   };
 
   scrollToEditedMessage = () => {
     const editedMessage = this.getEditedMessage();
     if (!editedMessage) {
       return;
     }
     const editedMessageKey = messageKey(editedMessage);
     this.props.inputState?.scrollToMessage(editedMessageKey);
   };
 
   exitEditMode = () => {
     this.props.inputState?.setEditedMessage(null, () => {
       this.updateText(this.props.draft);
       this.focusAndUpdateButtonsVisibility();
       this.updateSendButton(this.props.draft);
     });
   };
 
   onNavigationBeforeRemove = e => {
     if (!this.isEditMode()) {
       return;
     }
     const { action } = e.data;
     e.preventDefault();
     const saveExit = () => {
       this.props.inputState?.setEditedMessage(null, () => {
         this.setState({ isExitingEditMode: true }, () => {
           if (!this.props.navigation) {
             return;
           }
           this.props.navigation.dispatch(action);
         });
       });
     };
     if (!this.isMessageEdited()) {
       saveExit();
       return;
     }
     exitEditAlert(saveExit);
   };
 
   onPressJoin = () => {
     this.props.dispatchActionPromise(joinThreadActionTypes, this.joinAction());
   };
 
   async joinAction() {
     const query = this.props.calendarQuery();
     return await this.props.joinThread({
       threadID: this.props.threadInfo.id,
       calendarQuery: {
         startDate: query.startDate,
         endDate: query.endDate,
         filters: [
           ...query.filters,
           { type: 'threads', threadIDs: [this.props.threadInfo.id] },
         ],
       },
     });
   }
 
   expandButtons = () => {
     if (this.state.buttonsExpanded || this.isEditMode()) {
       return;
     }
     this.targetExpandoButtonsOpen.setValue(1);
     this.setState({ buttonsExpanded: true });
   };
 
   hideButtons() {
     if (
       ChatInputBar.mediaGalleryOpen(this.props) ||
       !this.systemKeyboardShowing ||
       !this.state.buttonsExpanded
     ) {
       return;
     }
     this.targetExpandoButtonsOpen.setValue(0);
     this.setState({ buttonsExpanded: false });
   }
 
   immediatelyHideButtons() {
     this.expandoButtonsOpen.setValue(0);
     this.targetExpandoButtonsOpen.setValue(0);
     this.setState({ buttonsExpanded: false });
   }
 
   showMediaGallery = () => {
     const { keyboardState } = this.props;
     invariant(keyboardState, 'keyboardState should be initialized');
     keyboardState.showMediaGallery(this.props.threadInfo);
   };
 
   dismissKeyboard = () => {
     const { keyboardState } = this.props;
     keyboardState && keyboardState.dismissKeyboard();
   };
 }
 
 const unboundStyles = {
   cameraIcon: {
     paddingBottom: Platform.OS === 'android' ? 11 : 8,
     paddingRight: 5,
   },
   cameraRollIcon: {
     paddingBottom: Platform.OS === 'android' ? 11 : 8,
     paddingRight: 5,
   },
   container: {
     backgroundColor: 'listBackground',
     paddingLeft: Platform.OS === 'android' ? 10 : 5,
   },
   expandButton: {
     bottom: 0,
     position: 'absolute',
     right: 0,
   },
   expandIcon: {
     paddingBottom: Platform.OS === 'android' ? 13 : 11,
     paddingRight: 2,
   },
   expandoButtons: {
     alignSelf: 'flex-end',
   },
   explanation: {
     color: 'listBackgroundSecondaryLabel',
     paddingBottom: 4,
     paddingTop: 1,
     textAlign: 'center',
   },
   innerExpandoButtons: {
     alignItems: 'flex-end',
     alignSelf: 'flex-end',
     flexDirection: 'row',
   },
   inputContainer: {
     flexDirection: 'row',
   },
   joinButton: {
     borderRadius: 8,
     flex: 1,
     justifyContent: 'center',
     marginHorizontal: 12,
     marginVertical: 3,
   },
   joinButtonContainer: {
     flexDirection: 'row',
     height: 48,
     marginBottom: 8,
   },
   editView: {
     marginLeft: 20,
     marginRight: 20,
     padding: 10,
     flexDirection: 'row',
     justifyContent: 'space-between',
   },
   editViewContent: {
     flex: 1,
     paddingRight: 6,
   },
   exitEditButton: {
     marginTop: 6,
   },
   editingLabel: {
     paddingBottom: 4,
   },
   editingMessagePreview: {
     color: 'listForegroundLabel',
   },
   joinButtonContent: {
     flexDirection: 'row',
     justifyContent: 'center',
     alignItems: 'center',
   },
   joinButtonTextLight: {
     color: 'white',
     fontSize: 20,
     marginHorizontal: 4,
   },
   joinButtonTextDark: {
     color: 'black',
     fontSize: 20,
     marginHorizontal: 4,
   },
   joinThreadLoadingIndicator: {
     paddingVertical: 2,
   },
   sendButton: {
     position: 'absolute',
     bottom: 4,
     left: 0,
   },
   sendIcon: {
     paddingLeft: 9,
     paddingRight: 8,
     paddingVertical: 6,
   },
   textInput: {
     backgroundColor: 'listInputBackground',
     borderRadius: 12,
     color: 'listForegroundLabel',
     fontSize: 16,
     marginLeft: 4,
     marginRight: 4,
     marginTop: 6,
     marginBottom: 8,
     maxHeight: 110,
     paddingHorizontal: 10,
     paddingVertical: 5,
   },
 };
 
 const joinThreadLoadingStatusSelector = createLoadingStatusSelector(
   joinThreadActionTypes,
 );
 const createThreadLoadingStatusSelector =
   createLoadingStatusSelector(newThreadActionTypes);
 
 type ConnectedChatInputBarBaseProps = {
   ...BaseProps,
   +onInputBarLayout?: (event: LayoutEvent) => mixed,
   +openCamera: () => mixed,
   +navigation?: ChatNavigationProp<'MessageList'>,
 };
 function ConnectedChatInputBarBase(props: ConnectedChatInputBarBaseProps) {
   const navContext = React.useContext(NavContext);
   const keyboardState = React.useContext(KeyboardContext);
   const inputState = React.useContext(InputStateContext);
 
   const viewerID = useSelector(
     state => state.currentUserInfo && state.currentUserInfo.id,
   );
   const draft = useSelector(
     state =>
       state.draftStore.drafts[draftKeyFromThreadID(props.threadInfo.id)] ?? '',
   );
   const joinThreadLoadingStatus = useSelector(joinThreadLoadingStatusSelector);
   const createThreadLoadingStatus = useSelector(
     createThreadLoadingStatusSelector,
   );
   const threadCreationInProgress = createThreadLoadingStatus === 'loading';
   const calendarQuery = useSelector(state =>
     nonThreadCalendarQuery({
       redux: state,
       navContext,
     }),
   );
   const nextLocalID = useSelector(state => state.nextLocalID);
   const userInfos = useSelector(state => state.userStore.userInfos);
 
   const styles = useStyles(unboundStyles);
   const colors = useColors();
 
   const isActive = React.useMemo(
     () => props.threadInfo.id === activeThreadSelector(navContext),
     [props.threadInfo.id, navContext],
   );
 
   const dispatch = useDispatch();
   const dispatchActionPromise = useDispatchActionPromise();
   const callJoinThread = useServerCall(joinThread);
 
   const userSearchIndex = useSelector(userStoreSearchIndex);
 
   const { parentThreadID } = props.threadInfo;
   const parentThreadInfo = useSelector(state =>
     parentThreadID ? threadInfoSelector(state)[parentThreadID] : null,
   );
 
   const mentionsCandidates = getMentionsCandidates(
     props.threadInfo,
     parentThreadInfo,
   );
 
   const editedMessageInfo = inputState?.editState.editedMessage;
   const editedMessagePreview = useMessagePreview(
     editedMessageInfo,
     props.threadInfo,
     getDefaultTextMessageRules().simpleMarkdownRules,
   );
   const editMessage = useEditMessage();
 
   return (
     <ChatInputBar
       {...props}
       viewerID={viewerID}
       draft={draft}
       joinThreadLoadingStatus={joinThreadLoadingStatus}
       threadCreationInProgress={threadCreationInProgress}
       calendarQuery={calendarQuery}
       nextLocalID={nextLocalID}
       userInfos={userInfos}
       colors={colors}
       styles={styles}
       isActive={isActive}
       keyboardState={keyboardState}
       dispatch={dispatch}
       dispatchActionPromise={dispatchActionPromise}
       joinThread={callJoinThread}
       inputState={inputState}
       userSearchIndex={userSearchIndex}
       mentionsCandidates={mentionsCandidates}
       parentThreadInfo={parentThreadInfo}
       editedMessagePreview={editedMessagePreview}
       editedMessageInfo={editedMessageInfo}
       editMessage={editMessage}
       navigation={props.navigation}
     />
   );
 }
 
 type DummyChatInputBarProps = {
   ...BaseProps,
   +onHeightMeasured: (height: number) => mixed,
 };
 const noop = () => {};
 function DummyChatInputBar(props: DummyChatInputBarProps): React.Node {
   const { onHeightMeasured, ...restProps } = props;
   const onInputBarLayout = React.useCallback(
     (event: LayoutEvent) => {
       const { height } = event.nativeEvent.layout;
       onHeightMeasured(height);
     },
     [onHeightMeasured],
   );
   return (
     <View pointerEvents="none">
       <ConnectedChatInputBarBase
         {...restProps}
         onInputBarLayout={onInputBarLayout}
         openCamera={noop}
       />
     </View>
   );
 }
 
 type ChatInputBarProps = {
   ...BaseProps,
   +navigation: ChatNavigationProp<'MessageList'>,
   +route: NavigationRoute<'MessageList'>,
 };
 const ConnectedChatInputBar: React.ComponentType<ChatInputBarProps> =
   React.memo<ChatInputBarProps>(function ConnectedChatInputBar(
     props: ChatInputBarProps,
   ) {
     const { navigation, route, ...restProps } = props;
     const keyboardState = React.useContext(KeyboardContext);
 
     const { threadInfo } = props;
     const imagePastedCallback = React.useCallback(
       imagePastedEvent => {
         if (threadInfo.id !== imagePastedEvent.threadID) {
           return;
         }
         const pastedImage: PhotoPaste = {
           step: 'photo_paste',
           dimensions: {
             height: imagePastedEvent.height,
             width: imagePastedEvent.width,
           },
           filename: imagePastedEvent.fileName,
           uri: 'file://' + imagePastedEvent.filePath,
           selectTime: 0,
           sendTime: 0,
           retries: 0,
         };
         navigation.navigate<'ImagePasteModal'>({
           name: ImagePasteModalRouteName,
           params: {
             imagePasteStagingInfo: pastedImage,
             thread: threadInfo,
           },
         });
       },
       [navigation, threadInfo],
     );
 
     React.useEffect(() => {
       const imagePasteListener = NativeAppEventEmitter.addListener(
         'imagePasted',
         imagePastedCallback,
       );
       return () => imagePasteListener.remove();
     }, [imagePastedCallback]);
 
     const chatContext = React.useContext(ChatContext);
     invariant(chatContext, 'should be set');
     const { setChatInputBarHeight, deleteChatInputBarHeight } = chatContext;
     const onInputBarLayout = React.useCallback(
       (event: LayoutEvent) => {
         const { height } = event.nativeEvent.layout;
         setChatInputBarHeight(threadInfo.id, height);
       },
       [threadInfo.id, setChatInputBarHeight],
     );
 
     React.useEffect(() => {
       return () => {
         deleteChatInputBarHeight(threadInfo.id);
       };
     }, [deleteChatInputBarHeight, threadInfo.id]);
 
     const openCamera = React.useCallback(() => {
       keyboardState?.dismissKeyboard();
       navigation.navigate<'ChatCameraModal'>({
         name: ChatCameraModalRouteName,
         params: {
           presentedFrom: route.key,
           thread: threadInfo,
         },
       });
     }, [keyboardState, navigation, route.key, threadInfo]);
 
     return (
       <ConnectedChatInputBarBase
         {...restProps}
         onInputBarLayout={onInputBarLayout}
         openCamera={openCamera}
         navigation={navigation}
       />
     );
   });
 
 export { ConnectedChatInputBar as ChatInputBar, DummyChatInputBar };
diff --git a/native/crash.react.js b/native/crash.react.js
index 15168c9b1..4d5527376 100644
--- a/native/crash.react.js
+++ b/native/crash.react.js
@@ -1,296 +1,296 @@
 // @flow
 
 import Icon from '@expo/vector-icons/FontAwesome.js';
 import Clipboard from '@react-native-clipboard/clipboard';
 import invariant from 'invariant';
 import _shuffle from 'lodash/fp/shuffle.js';
 import * as React from 'react';
 import {
   View,
   Text,
   Platform,
   StyleSheet,
   ScrollView,
   ActivityIndicator,
 } from 'react-native';
 
 import {
   sendReportActionTypes,
   sendReport,
 } from 'lib/actions/report-actions.js';
 import { logOutActionTypes, logOut } from 'lib/actions/user-actions.js';
 import { preRequestUserStateSelector } from 'lib/selectors/account-selectors.js';
 import type { LogOutResult } from 'lib/types/account-types.js';
 import {
   type ErrorData,
   type ClientReportCreationRequest,
   type ReportCreationResponse,
   reportTypes,
 } from 'lib/types/report-types.js';
 import type { PreRequestUserState } from 'lib/types/session-types.js';
 import { actionLogger } from 'lib/utils/action-logger.js';
 import {
   type DispatchActionPromise,
   useServerCall,
   useDispatchActionPromise,
 } from 'lib/utils/action-utils.js';
 import { useIsReportEnabled } from 'lib/utils/report-utils.js';
 import {
   sanitizeReduxReport,
   type ReduxCrashReport,
 } from 'lib/utils/sanitization.js';
 import sleep from 'lib/utils/sleep.js';
 
 import Button from './components/button.react.js';
 import ConnectedStatusBar from './connected-status-bar.react.js';
 import { commCoreModule } from './native-modules.js';
 import { persistConfig, codeVersion } from './redux/persist.js';
 import { useSelector } from './redux/redux-utils.js';
 import { wipeAndExit } from './utils/crash-utils.js';
 
 const errorTitles = ['Oh no!!', 'Womp womp womp...'];
 
 type BaseProps = {
   +errorData: $ReadOnlyArray<ErrorData>,
 };
 type Props = {
   ...BaseProps,
   // Redux state
   +preRequestUserState: PreRequestUserState,
   // Redux dispatch functions
   +dispatchActionPromise: DispatchActionPromise,
   // async functions that hit server APIs
   +sendReport: (
     request: ClientReportCreationRequest,
   ) => Promise<ReportCreationResponse>,
   +logOut: (preRequestUserState: PreRequestUserState) => Promise<LogOutResult>,
   +crashReportingEnabled: boolean,
 };
 type State = {
   +errorReportID: ?string,
   +doneWaiting: boolean,
 };
 class Crash extends React.PureComponent<Props, State> {
   errorTitle = _shuffle(errorTitles)[0];
 
   constructor(props) {
     super(props);
     this.state = {
       errorReportID: null,
       doneWaiting: !props.crashReportingEnabled,
     };
   }
 
   componentDidMount() {
     if (this.state.doneWaiting) {
       return;
     }
     this.props.dispatchActionPromise(sendReportActionTypes, this.sendReport());
     this.timeOut();
   }
 
   async timeOut() {
     // If it takes more than 10s, give up and let the user exit
     await sleep(10000);
     this.setState({ doneWaiting: true });
   }
 
   render() {
     const errorText = [...this.props.errorData]
       .reverse()
       .map(errorData => errorData.error.message)
       .join('\n');
 
     let crashID;
     if (!this.state.doneWaiting) {
       crashID = <ActivityIndicator size="small" color="black" />;
     } else if (this.state.doneWaiting && this.state.errorReportID) {
       crashID = (
         <View style={styles.crashID}>
           <Text style={styles.crashIDText}>Crash report ID:</Text>
           <View style={styles.errorReportID}>
             <Text style={styles.errorReportIDText}>
               {this.state.errorReportID}
             </Text>
             <Button onPress={this.onCopyCrashReportID}>
               <Text style={styles.copyCrashReportIDButtonText}>(Copy)</Text>
             </Button>
           </View>
         </View>
       );
     } else {
       crashID = (
         <Text style={styles.text}>
           Crash reporting can be enabled in the Profile tab.
         </Text>
       );
     }
 
     const buttonStyle = { opacity: Number(this.state.doneWaiting) };
 
     return (
       <View style={styles.container}>
         <ConnectedStatusBar barStyle="dark-content" />
         <Icon name="bug" size={32} color="red" />
         <Text style={styles.header}>{this.errorTitle}</Text>
-        <Text style={styles.text}>I&apos;m sorry, but the app crashed.</Text>
+        <Text style={styles.text}>I&rsquo;m sorry, but the app crashed.</Text>
         {crashID}
         <Text style={styles.text}>
-          Here&apos;s some text that&apos;s probably not helpful:
+          Here&rsquo;s some text that&rsquo;s probably not helpful:
         </Text>
         <ScrollView style={styles.scrollView}>
           <Text style={styles.errorText}>{errorText}</Text>
         </ScrollView>
         <View style={[styles.buttons, buttonStyle]}>
           <Button onPress={this.onPressKill} style={styles.button}>
             <Text style={styles.buttonText}>Kill the app</Text>
           </Button>
           <Button onPress={this.onPressWipe} style={styles.button}>
             <Text style={styles.buttonText}>Wipe state and kill app</Text>
           </Button>
         </View>
       </View>
     );
   }
 
   async sendReport() {
     const sanitizedReduxReport: ReduxCrashReport = sanitizeReduxReport({
       preloadedState: actionLogger.preloadedState,
       currentState: actionLogger.currentState,
       actions: actionLogger.actions,
     });
     const result = await this.props.sendReport({
       type: reportTypes.ERROR,
       platformDetails: {
         platform: Platform.OS,
         codeVersion,
         stateVersion: persistConfig.version,
       },
       errors: this.props.errorData.map(data => ({
         errorMessage: data.error.message,
         stack: data.error.stack,
         componentStack: data.info && data.info.componentStack,
       })),
       ...sanitizedReduxReport,
     });
     this.setState({
       errorReportID: result.id,
       doneWaiting: true,
     });
   }
 
   onPressKill = () => {
     if (!this.state.doneWaiting) {
       return;
     }
     commCoreModule.terminate();
   };
 
   onPressWipe = async () => {
     if (!this.state.doneWaiting) {
       return;
     }
     this.props.dispatchActionPromise(logOutActionTypes, this.logOutAndExit());
   };
 
   async logOutAndExit() {
     try {
       await this.props.logOut(this.props.preRequestUserState);
     } catch (e) {}
     await wipeAndExit();
   }
 
   onCopyCrashReportID = () => {
     invariant(this.state.errorReportID, 'should be set');
     Clipboard.setString(this.state.errorReportID);
   };
 }
 
 const styles = StyleSheet.create({
   button: {
     backgroundColor: '#FF0000',
     borderRadius: 5,
     marginHorizontal: 10,
     paddingHorizontal: 10,
     paddingVertical: 5,
   },
   buttonText: {
     color: 'white',
     fontSize: 16,
   },
   buttons: {
     flexDirection: 'row',
   },
   container: {
     alignItems: 'center',
     backgroundColor: 'white',
     flex: 1,
     justifyContent: 'center',
   },
   copyCrashReportIDButtonText: {
     color: '#036AFF',
   },
   crashID: {
     flexDirection: 'row',
     paddingBottom: 12,
     paddingTop: 2,
   },
   crashIDText: {
     color: 'black',
     paddingRight: 8,
   },
   errorReportID: {
     flexDirection: 'row',
     height: 20,
   },
   errorReportIDText: {
     color: 'black',
     paddingRight: 8,
   },
   errorText: {
     color: 'black',
     fontFamily: Platform.select({
       ios: 'Menlo',
       default: 'monospace',
     }),
   },
   header: {
     color: 'black',
     fontSize: 24,
     paddingBottom: 24,
   },
   scrollView: {
     flex: 1,
     marginBottom: 24,
     marginTop: 12,
     maxHeight: 200,
     paddingHorizontal: 50,
   },
   text: {
     color: 'black',
     paddingBottom: 12,
   },
 });
 
 const ConnectedCrash: React.ComponentType<BaseProps> = React.memo<BaseProps>(
   function ConnectedCrash(props: BaseProps) {
     const preRequestUserState = useSelector(preRequestUserStateSelector);
 
     const dispatchActionPromise = useDispatchActionPromise();
     const callSendReport = useServerCall(sendReport);
     const callLogOut = useServerCall(logOut);
     const crashReportingEnabled = useIsReportEnabled('crashReports');
     return (
       <Crash
         {...props}
         preRequestUserState={preRequestUserState}
         dispatchActionPromise={dispatchActionPromise}
         sendReport={callSendReport}
         logOut={callLogOut}
         crashReportingEnabled={crashReportingEnabled}
       />
     );
   },
 );
 
 export default ConnectedCrash;
diff --git a/web/chat/chat-input-bar.react.js b/web/chat/chat-input-bar.react.js
index e22d834ce..4108a35fa 100644
--- a/web/chat/chat-input-bar.react.js
+++ b/web/chat/chat-input-bar.react.js
@@ -1,657 +1,657 @@
 // @flow
 
 import invariant from 'invariant';
 import _difference from 'lodash/fp/difference.js';
 import * as React from 'react';
 
 import {
   joinThreadActionTypes,
   joinThread,
   newThreadActionTypes,
 } from 'lib/actions/thread-actions.js';
 import SWMansionIcon from 'lib/components/SWMansionIcon.react.js';
 import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
 import { threadInfoSelector } from 'lib/selectors/thread-selectors.js';
 import { userStoreSearchIndex } from 'lib/selectors/user-selectors.js';
 import {
   getTypeaheadUserSuggestions,
   getTypeaheadRegexMatches,
   getMentionsCandidates,
 } from 'lib/shared/mention-utils.js';
 import type { TypeaheadMatchedStrings } from 'lib/shared/mention-utils.js';
 import { localIDPrefix, trimMessage } from 'lib/shared/message-utils.js';
 import {
   threadHasPermission,
   viewerIsMember,
   threadFrozenDueToViewerBlock,
   threadActualMembers,
   checkIfDefaultMembersAreVoiced,
 } from 'lib/shared/thread-utils.js';
 import type { CalendarQuery } from 'lib/types/entry-types.js';
 import type { LoadingStatus } from 'lib/types/loading-types.js';
 import { messageTypes } from 'lib/types/message-types-enum.js';
 import { threadPermissions } from 'lib/types/thread-permission-types.js';
 import {
   type ThreadInfo,
   type ClientThreadJoinRequest,
   type ThreadJoinPayload,
   type RelativeMemberInfo,
 } from 'lib/types/thread-types.js';
 import { type UserInfos } from 'lib/types/user-types.js';
 import {
   type DispatchActionPromise,
   useServerCall,
   useDispatchActionPromise,
 } from 'lib/utils/action-utils.js';
 
 import css from './chat-input-bar.css';
 import TypeaheadTooltip from './typeahead-tooltip.react.js';
 import Button from '../components/button.react.js';
 import {
   type InputState,
   type PendingMultimediaUpload,
 } from '../input/input-state.js';
 import LoadingIndicator from '../loading-indicator.react.js';
 import { allowedMimeTypeString } from '../media/file-utils.js';
 import Multimedia from '../media/multimedia.react.js';
 import { useSelector } from '../redux/redux-utils.js';
 import { nonThreadCalendarQuery } from '../selectors/nav-selectors.js';
 import { webTypeaheadRegex } from '../utils/typeahead-utils.js';
 
 type BaseProps = {
   +threadInfo: ThreadInfo,
   +inputState: InputState,
 };
 type Props = {
   ...BaseProps,
   +viewerID: ?string,
   +joinThreadLoadingStatus: LoadingStatus,
   +threadCreationInProgress: boolean,
   +calendarQuery: () => CalendarQuery,
   +nextLocalID: number,
   +isThreadActive: boolean,
   +userInfos: UserInfos,
   +dispatchActionPromise: DispatchActionPromise,
   +joinThread: (request: ClientThreadJoinRequest) => Promise<ThreadJoinPayload>,
   +typeaheadMatchedStrings: ?TypeaheadMatchedStrings,
   +suggestedUsers: $ReadOnlyArray<RelativeMemberInfo>,
   +parentThreadInfo: ?ThreadInfo,
 };
 
 class ChatInputBar extends React.PureComponent<Props> {
   textarea: ?HTMLTextAreaElement;
   multimediaInput: ?HTMLInputElement;
 
   componentDidMount() {
     this.updateHeight();
     if (this.props.isThreadActive) {
       this.addReplyListener();
     }
   }
 
   componentWillUnmount() {
     if (this.props.isThreadActive) {
       this.removeReplyListener();
     }
   }
 
   componentDidUpdate(prevProps: Props) {
     if (this.props.isThreadActive && !prevProps.isThreadActive) {
       this.addReplyListener();
     } else if (!this.props.isThreadActive && prevProps.isThreadActive) {
       this.removeReplyListener();
     }
 
     const { inputState } = this.props;
     const prevInputState = prevProps.inputState;
     if (inputState.draft !== prevInputState.draft) {
       this.updateHeight();
     }
 
     if (
       inputState.draft !== prevInputState.draft ||
       inputState.textCursorPosition !== prevInputState.textCursorPosition
     ) {
       inputState.setTypeaheadState({
         canBeVisible: true,
       });
     }
 
     const curUploadIDs = ChatInputBar.unassignedUploadIDs(
       inputState.pendingUploads,
     );
     const prevUploadIDs = ChatInputBar.unassignedUploadIDs(
       prevInputState.pendingUploads,
     );
     if (
       this.multimediaInput &&
       _difference(prevUploadIDs)(curUploadIDs).length > 0
     ) {
       // Whenever a pending upload is removed, we reset the file
       // HTMLInputElement's value field, so that if the same upload occurs again
       // the onChange call doesn't get filtered
       this.multimediaInput.value = '';
     } else if (
       this.textarea &&
       _difference(curUploadIDs)(prevUploadIDs).length > 0
     ) {
       // Whenever a pending upload is added, we focus the textarea
       this.textarea.focus();
       return;
     }
 
     if (
       (this.props.threadInfo.id !== prevProps.threadInfo.id ||
         (inputState.textCursorPosition !== prevInputState.textCursorPosition &&
           this.textarea?.selectionStart === this.textarea?.selectionEnd)) &&
       this.textarea
     ) {
       this.textarea.focus();
 
       this.textarea?.setSelectionRange(
         inputState.textCursorPosition,
         inputState.textCursorPosition,
         'none',
       );
     }
   }
 
   static unassignedUploadIDs(
     pendingUploads: $ReadOnlyArray<PendingMultimediaUpload>,
   ) {
     return pendingUploads
       .filter(
         (pendingUpload: PendingMultimediaUpload) => !pendingUpload.messageID,
       )
       .map((pendingUpload: PendingMultimediaUpload) => pendingUpload.localID);
   }
 
   updateHeight() {
     const textarea = this.textarea;
     if (textarea) {
       textarea.style.height = 'auto';
       const newHeight = Math.min(textarea.scrollHeight, 150);
       textarea.style.height = `${newHeight}px`;
     }
   }
 
   addReplyListener() {
     invariant(
       this.props.inputState,
       'inputState should be set in addReplyListener',
     );
     this.props.inputState.addReplyListener(this.focusAndUpdateText);
   }
 
   removeReplyListener() {
     invariant(
       this.props.inputState,
       'inputState should be set in removeReplyListener',
     );
     this.props.inputState.removeReplyListener(this.focusAndUpdateText);
   }
 
   render() {
     const isMember = viewerIsMember(this.props.threadInfo);
     const canJoin = threadHasPermission(
       this.props.threadInfo,
       threadPermissions.JOIN_THREAD,
     );
 
     let joinButton = null;
     if (!isMember && canJoin && !this.props.threadCreationInProgress) {
       let buttonContent;
       if (this.props.joinThreadLoadingStatus === 'loading') {
         buttonContent = (
           <LoadingIndicator
             status={this.props.joinThreadLoadingStatus}
             size="medium"
             color="white"
           />
         );
       } else {
         buttonContent = (
           <>
             <SWMansionIcon icon="plus" size={24} />
             <p className={css.joinButtonText}>Join Chat</p>
           </>
         );
       }
       joinButton = (
         <div className={css.joinButtonContainer}>
           <Button
             variant="filled"
             buttonColor={{ backgroundColor: `#${this.props.threadInfo.color}` }}
             onClick={this.onClickJoin}
           >
             {buttonContent}
           </Button>
         </div>
       );
     }
 
     const { pendingUploads, cancelPendingUpload } = this.props.inputState;
     const multimediaPreviews = pendingUploads.map(pendingUpload => {
       let mediaSource;
       if (
         pendingUpload.mediaType !== 'encrypted_photo' &&
         pendingUpload.mediaType !== 'encrypted_video'
       ) {
         mediaSource = {
           type: pendingUpload.mediaType,
           uri: pendingUpload.uri,
         };
       } else {
         invariant(
           pendingUpload.encryptionKey,
           'encryptionKey should be set for encrypted media',
         );
         mediaSource = {
           type: pendingUpload.mediaType,
           holder: pendingUpload.uri,
           encryptionKey: pendingUpload.encryptionKey,
         };
       }
       return (
         <Multimedia
           mediaSource={mediaSource}
           pendingUpload={pendingUpload}
           remove={cancelPendingUpload}
           multimediaCSSClass={css.multimedia}
           multimediaImageCSSClass={css.multimediaImage}
           key={pendingUpload.localID}
         />
       );
     });
     const previews =
       multimediaPreviews.length > 0 ? (
         <div className={css.previews}>{multimediaPreviews}</div>
       ) : null;
 
     let content;
     // If the thread is created by somebody else while the viewer is attempting
     // to create it, the threadInfo might be modified in-place and won't
     // list the viewer as a member, which will end up hiding the input. In
     // this case, we will assume that our creation action will get translated,
     // into a join and as long as members are voiced, we can show the input.
     const defaultMembersAreVoiced = checkIfDefaultMembersAreVoiced(
       this.props.threadInfo,
     );
 
     let sendButton;
     if (this.props.inputState.draft.length) {
       sendButton = (
         <a onClick={this.onSend} className={css.sendButton}>
           <SWMansionIcon
             icon="send-2"
             size={22}
             color={`#${this.props.threadInfo.color}`}
           />
         </a>
       );
     }
 
     if (
       threadHasPermission(this.props.threadInfo, threadPermissions.VOICED) ||
       (this.props.threadCreationInProgress && defaultMembersAreVoiced)
     ) {
       content = (
         <div className={css.inputBarWrapper}>
           <a className={css.multimediaUpload} onClick={this.onMultimediaClick}>
             <input
               type="file"
               onChange={this.onMultimediaFileChange}
               ref={this.multimediaInputRef}
               accept={allowedMimeTypeString}
               multiple
             />
             <SWMansionIcon
               icon="image-1"
               size={22}
               color={`#${this.props.threadInfo.color}`}
               disableFill
             />
           </a>
           <div className={css.inputBarTextInput}>
             <textarea
               rows="1"
               placeholder="Type your message"
               value={this.props.inputState.draft}
               onChange={this.onChangeMessageText}
               onKeyDown={this.onKeyDown}
               onClick={this.onClickTextarea}
               onSelect={this.onSelectTextarea}
               ref={this.textareaRef}
               autoFocus
             />
           </div>
           {sendButton}
         </div>
       );
     } else if (
       threadFrozenDueToViewerBlock(
         this.props.threadInfo,
         this.props.viewerID,
         this.props.userInfos,
       ) &&
       threadActualMembers(this.props.threadInfo.members).length === 2
     ) {
       content = (
         <span className={css.explanation}>
-          You can&apos;t send messages to a user that you&apos;ve blocked.
+          You can&rsquo;t send messages to a user that you&rsquo;ve blocked.
         </span>
       );
     } else if (isMember) {
       content = (
         <span className={css.explanation}>
-          You don&apos;t have permission to send messages.
+          You don&rsquo;t have permission to send messages.
         </span>
       );
     } else if (defaultMembersAreVoiced && canJoin) {
       content = null;
     } else {
       content = (
         <span className={css.explanation}>
-          You don&apos;t have permission to send messages.
+          You don&rsquo;t have permission to send messages.
         </span>
       );
     }
 
     let typeaheadTooltip;
     if (
       this.props.inputState.typeaheadState.canBeVisible &&
       this.props.suggestedUsers.length > 0 &&
       this.props.typeaheadMatchedStrings &&
       this.textarea
     ) {
       typeaheadTooltip = (
         <TypeaheadTooltip
           inputState={this.props.inputState}
           textarea={this.textarea}
           matchedStrings={this.props.typeaheadMatchedStrings}
           suggestedUsers={this.props.suggestedUsers}
         />
       );
     }
 
     return (
       <div className={css.inputBar}>
         {joinButton}
         {previews}
         {content}
         {typeaheadTooltip}
       </div>
     );
   }
 
   textareaRef = (textarea: ?HTMLTextAreaElement) => {
     this.textarea = textarea;
     if (textarea) {
       textarea.focus();
     }
   };
 
   onChangeMessageText = (event: SyntheticEvent<HTMLTextAreaElement>) => {
     this.props.inputState.setDraft(event.currentTarget.value);
     this.props.inputState.setTextCursorPosition(
       event.currentTarget.selectionStart,
     );
   };
 
   onClickTextarea = (event: SyntheticEvent<HTMLTextAreaElement>) => {
     this.props.inputState.setTextCursorPosition(
       event.currentTarget.selectionStart,
     );
   };
 
   onSelectTextarea = (event: SyntheticEvent<HTMLTextAreaElement>) => {
     this.props.inputState.setTextCursorPosition(
       event.currentTarget.selectionStart,
     );
   };
 
   focusAndUpdateText = (text: string) => {
     // We need to call focus() first on Safari, otherwise the cursor
     // ends up at the start instead of the end for some reason
     const { textarea } = this;
     invariant(textarea, 'textarea should be set');
     textarea.focus();
 
     // We reset the textarea to an empty string at the start so that the cursor
     // always ends up at the end, even if the text doesn't actually change
     textarea.value = '';
     const currentText = this.props.inputState.draft;
     if (!currentText.startsWith(text)) {
       const prependedText = text.concat(currentText);
       this.props.inputState.setDraft(prependedText);
       textarea.value = prependedText;
     } else {
       textarea.value = currentText;
     }
 
     // The above strategies make sure the cursor is at the end,
     // but we also need to make sure that we're scrolled to the bottom
     textarea.scrollTop = textarea.scrollHeight;
   };
 
   onKeyDown = (event: SyntheticKeyboardEvent<HTMLTextAreaElement>) => {
     const { accept, close, moveChoiceUp, moveChoiceDown } =
       this.props.inputState.typeaheadState;
 
     const actions = {
       Enter: accept,
       Tab: accept,
       ArrowDown: moveChoiceDown,
       ArrowUp: moveChoiceUp,
       Escape: close,
     };
 
     if (
       this.props.inputState.typeaheadState.canBeVisible &&
       actions[event.key]
     ) {
       event.preventDefault();
       actions[event.key]();
     } else if (event.key === 'Enter' && !event.shiftKey) {
       event.preventDefault();
       this.send();
     }
   };
 
   onSend = (event: SyntheticEvent<HTMLAnchorElement>) => {
     event.preventDefault();
     this.send();
   };
 
   send() {
     let { nextLocalID } = this.props;
 
     const text = trimMessage(this.props.inputState.draft);
     if (text) {
       this.dispatchTextMessageAction(text, nextLocalID);
       nextLocalID++;
     }
     if (this.props.inputState.pendingUploads.length > 0) {
       this.props.inputState.createMultimediaMessage(
         nextLocalID,
         this.props.threadInfo,
       );
     }
   }
 
   dispatchTextMessageAction(text: string, nextLocalID: number) {
     this.props.inputState.setDraft('');
 
     const localID = `${localIDPrefix}${nextLocalID}`;
     const creatorID = this.props.viewerID;
     invariant(creatorID, 'should have viewer ID in order to send a message');
 
     this.props.inputState.sendTextMessage(
       {
         type: messageTypes.TEXT,
         localID,
         threadID: this.props.threadInfo.id,
         text,
         creatorID,
         time: Date.now(),
       },
       this.props.threadInfo,
       this.props.parentThreadInfo,
     );
   }
 
   multimediaInputRef = (multimediaInput: ?HTMLInputElement) => {
     this.multimediaInput = multimediaInput;
   };
 
   onMultimediaClick = () => {
     if (this.multimediaInput) {
       this.multimediaInput.click();
     }
   };
 
   onMultimediaFileChange = async (
     event: SyntheticInputEvent<HTMLInputElement>,
   ) => {
     const result = await this.props.inputState.appendFiles([
       ...event.target.files,
     ]);
     if (!result && this.multimediaInput) {
       this.multimediaInput.value = '';
     }
   };
 
   onClickJoin = () => {
     this.props.dispatchActionPromise(joinThreadActionTypes, this.joinAction());
   };
 
   async joinAction() {
     const query = this.props.calendarQuery();
     return await this.props.joinThread({
       threadID: this.props.threadInfo.id,
       calendarQuery: {
         startDate: query.startDate,
         endDate: query.endDate,
         filters: [
           ...query.filters,
           { type: 'threads', threadIDs: [this.props.threadInfo.id] },
         ],
       },
     });
   }
 }
 
 const joinThreadLoadingStatusSelector = createLoadingStatusSelector(
   joinThreadActionTypes,
 );
 const createThreadLoadingStatusSelector =
   createLoadingStatusSelector(newThreadActionTypes);
 
 const ConnectedChatInputBar: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedChatInputBar(props) {
     const viewerID = useSelector(
       state => state.currentUserInfo && state.currentUserInfo.id,
     );
     const nextLocalID = useSelector(state => state.nextLocalID);
     const isThreadActive = useSelector(
       state => props.threadInfo.id === state.navInfo.activeChatThreadID,
     );
     const userInfos = useSelector(state => state.userStore.userInfos);
     const joinThreadLoadingStatus = useSelector(
       joinThreadLoadingStatusSelector,
     );
     const createThreadLoadingStatus = useSelector(
       createThreadLoadingStatusSelector,
     );
     const threadCreationInProgress = createThreadLoadingStatus === 'loading';
     const calendarQuery = useSelector(nonThreadCalendarQuery);
     const dispatchActionPromise = useDispatchActionPromise();
     const callJoinThread = useServerCall(joinThread);
     const userSearchIndex = useSelector(userStoreSearchIndex);
 
     const { parentThreadID } = props.threadInfo;
     const parentThreadInfo = useSelector(state =>
       parentThreadID ? threadInfoSelector(state)[parentThreadID] : null,
     );
 
     const mentionsCandidates = getMentionsCandidates(
       props.threadInfo,
       parentThreadInfo,
     );
 
     const typeaheadRegexMatches = React.useMemo(
       () =>
         getTypeaheadRegexMatches(
           props.inputState.draft,
           {
             start: props.inputState.textCursorPosition,
             end: props.inputState.textCursorPosition,
           },
           webTypeaheadRegex,
         ),
       [props.inputState.textCursorPosition, props.inputState.draft],
     );
 
     const typeaheadMatchedStrings: ?TypeaheadMatchedStrings = React.useMemo(
       () =>
         typeaheadRegexMatches !== null
           ? {
               textBeforeAtSymbol:
                 typeaheadRegexMatches.groups?.textPrefix ?? '',
               usernamePrefix: typeaheadRegexMatches.groups?.username ?? '',
             }
           : null,
       [typeaheadRegexMatches],
     );
 
     React.useEffect(() => {
       if (props.inputState.typeaheadState.keepUpdatingThreadMembers) {
         const setter = props.inputState.setTypeaheadState;
         setter({
           frozenMentionsCandidates: mentionsCandidates,
         });
       }
     }, [
       mentionsCandidates,
       props.inputState.setTypeaheadState,
       props.inputState.typeaheadState.keepUpdatingThreadMembers,
     ]);
 
     const suggestedUsers: $ReadOnlyArray<RelativeMemberInfo> =
       React.useMemo(() => {
         if (!typeaheadMatchedStrings) {
           return [];
         }
         return getTypeaheadUserSuggestions(
           userSearchIndex,
           props.inputState.typeaheadState.frozenMentionsCandidates,
           viewerID,
           typeaheadMatchedStrings.usernamePrefix,
         );
       }, [
         userSearchIndex,
         props.inputState.typeaheadState.frozenMentionsCandidates,
         viewerID,
         typeaheadMatchedStrings,
       ]);
 
     return (
       <ChatInputBar
         {...props}
         viewerID={viewerID}
         joinThreadLoadingStatus={joinThreadLoadingStatus}
         threadCreationInProgress={threadCreationInProgress}
         calendarQuery={calendarQuery}
         nextLocalID={nextLocalID}
         isThreadActive={isThreadActive}
         userInfos={userInfos}
         dispatchActionPromise={dispatchActionPromise}
         joinThread={callJoinThread}
         typeaheadMatchedStrings={typeaheadMatchedStrings}
         suggestedUsers={suggestedUsers}
         parentThreadInfo={parentThreadInfo}
       />
     );
   });
 
 export default ConnectedChatInputBar;
diff --git a/web/modals/chat/invalid-upload.react.js b/web/modals/chat/invalid-upload.react.js
index 8d9d724bb..5589f2138 100644
--- a/web/modals/chat/invalid-upload.react.js
+++ b/web/modals/chat/invalid-upload.react.js
@@ -1,15 +1,15 @@
 // @flow
 
 import * as React from 'react';
 
 import Alert from '../alert.react.js';
 
 function InvalidUploadModal(): React.Node {
   return (
     <Alert title="Invalid upload">
-      We don&apos;t support that file type yet :(
+      We don&rsquo;t support that file type yet :(
     </Alert>
   );
 }
 
 export default InvalidUploadModal;
diff --git a/web/modals/terms-and-privacy-modal.react.js b/web/modals/terms-and-privacy-modal.react.js
index 347b65a8c..cde20c44a 100644
--- a/web/modals/terms-and-privacy-modal.react.js
+++ b/web/modals/terms-and-privacy-modal.react.js
@@ -1,96 +1,96 @@
 // @flow
 
 import * as React from 'react';
 
 import {
   policyAcknowledgment,
   policyAcknowledgmentActionTypes,
 } from 'lib/actions/user-actions.js';
 import { policyTypes } from 'lib/facts/policies.js';
 import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
 import {
   useDispatchActionPromise,
   useServerCall,
 } from 'lib/utils/action-utils.js';
 import { acknowledgePolicy } from 'lib/utils/policy-acknowledge-utlis.js';
 
 import Modal from './modal.react.js';
 import css from './terms-and-privacy-modal.css';
 import Button, { buttonThemes } from '../components/button.react.js';
 import LoadingIndicator from '../loading-indicator.react.js';
 import { useSelector } from '../redux/redux-utils.js';
 
 const loadingStatusSelector = createLoadingStatusSelector(
   policyAcknowledgmentActionTypes,
 );
 
 const disabledOnClose = () => undefined;
 
 function TermsAndPrivacyModal(): React.Node {
   const loading = useSelector(loadingStatusSelector);
   const [acknowledgmentError, setAcknowledgmentError] = React.useState('');
   const sendAcknowledgmentRequest = useServerCall(policyAcknowledgment);
   const dispatchActionPromise = useDispatchActionPromise();
 
   const onAccept = React.useCallback(() => {
     acknowledgePolicy(
       policyTypes.tosAndPrivacyPolicy,
       dispatchActionPromise,
       sendAcknowledgmentRequest,
       setAcknowledgmentError,
     );
   }, [dispatchActionPromise, sendAcknowledgmentRequest]);
 
   const buttonContent = React.useMemo(() => {
     if (loading === 'loading') {
       return <LoadingIndicator status="loading" size="medium" />;
     }
     return 'I accept';
   }, [loading]);
 
   return (
     <Modal
       withCloseButton={false}
       modalHeaderCentered={true}
       onClose={disabledOnClose}
       name="Terms of Service and Privacy Policy"
       size="large"
     >
       <div className={css.container}>
         We recently updated our{' '}
         <a
           href="https://comm.app/terms"
           target="_blank"
           rel="noreferrer"
           className={css.link}
         >
           Terms of Service
         </a>
         {' & '}
         <a
           href="https://comm.app/privacy"
           target="_blank"
           rel="noreferrer"
           className={css.link}
         >
           Privacy Policy
         </a>
-        . In order to continue using Comm, we&apos;re asking you to read
+        . In order to continue using Comm, we&rsquo;re asking you to read
         through, acknowledge, and accept the updated policies.
       </div>
 
       <div className={css.button}>
         <Button
           variant="filled"
           buttonColor={buttonThemes.standard}
           onClick={onAccept}
         >
           <div className={css.buttonContent}>{buttonContent}</div>
         </Button>
         <div className={css.error}>{acknowledgmentError}</div>
       </div>
     </Modal>
   );
 }
 
 export default TermsAndPrivacyModal;